Hi I am using Treeview component and vuex to create one tree structure.
computed: {
...mapState({
tree_detail: state => state.suiteTree.tree_detail
}),
fields () {
return {dataSource: this.tree_detail, id: 'id', parentID: 'pid', text: 'title', hasChildren: 'hasChild', htmlAttributes: 'hasAttribute', selected: 'isSelected'}
}
}
and I am using context menu to process node operations like the example given by https://ej2.syncfusion.com/vue/documentation/treeview/how-to/process-the-tree-node-operations-using-context-menu/#process-the-tree-node-operations-using-context-menu:
menuclick: function(args) {
var treevalidate = document.getElementById('treeview').ej2_instances[0];
var targetNodeId = treevalidate.selectedNodes[0];
var targetNode = treevalidate.getNode(targetNodeId)
var treeData = treevalidate.treeData[0];
if (args.item.text === "add new case") {
let new_case_id = undefined;
this.$store.dispatch('getNewCaseId', {suite_id: treeData.id}).then(response => {
new_case_id = response.data.new_case_id
treevalidate.beginEdit(new_case_id);
}, error => {
this.$Message.info('get new case id error');
})
}
}
When I click `add new case`, the async request returns update data with one new node, and I can see the tree is updated with new node, however, treevalidate.beginEdit(new_case_id) wouldn't create a edit textbox on the new node.
I also tried this way:
var newNode = treevalidate.getNode(new_case_id)
treevalidate.beginEdit(newNode)
It doesn't work, it seems newNode is empty like {id: "", text: "", parentID: "", selected: "", expanded: "", …}
