React:如何通过vis.js边缘的单击事件访问组件功能？
React:如何通过vis.js边缘的单击事件访问组件功能？
提问于 2018-08-02 06:11:42
我有一个react组件，比如：
export default class App extends Component {
// ...
_openDialog = () => {
this.setState({ isDialogOpen: true });
};
render() {
return (
<div>
<div className="tree_graph_div">
<Graph
graph={graph}
events={{
selectEdge: function(event) {
var { nodes, edges } = event;
if (edges.length == 1) {
//I want to access _openDialog here with edge id
}
}
}}
/>
</div>
<div>
<Dialog />
</div>
</div>
);
}
}该图是使用react- graph -vis创建的。
我想让selectEdge事件来处理:打开这个edge_id的对话框。
事件有边缘id，但是我怎样才能访问回函数_openDialog呢？
我试过了，但这里代表的是Graph对象，而不是App。
谢谢
我尝试使用箭头函数将Graph更改为以下内容：
<Graph graph={graph}
events={{
selectEdge: (event) => {
debugger;
}
}}
/>但是通过在调试器中停止，"this“没有函数_openDialog。
回答 1
Stack Overflow用户
回答已采纳
发布于 2018-08-02 06:48:36
您可以将指定给selectEdge的函数更改为箭头函数，以使用封闭的词法作用域，该作用域在this上具有_openDialog。
export default class App extends Component {
// ...
render() {
return (
<div>
<div className="tree_graph_div">
<Graph
graph={graph}
events={{
selectEdge: (event) => {
var { nodes, edges } = event;
if (edges.length == 1) {
this._openDialog(edges);
}
}
}}
/>
</div>
<div>
<Dialog />
</div>
</div>
);
}
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51642931
复制相关文章
相似问题