Not working with computed dataset

bifshteks commented 3 years ago

When using computed properties as :dataset such as:

computed: {
    myDataset() {
        return {value: '1'}
    }

vue throws [Vue warn]: <transition-group> children must be keyed: <div> and the tree does not render properly

Dongbox commented 3 years ago

I changed his VueTree.vue and just replace the node.data._key with index that it can run for me. In line 15: `... :key="index" ...

`

wrkyle commented 3 years ago

@bifshteks When the VueTree component is created it runs a method called addUniqueKey which iterates through the dataset and assigns a UUID to each node, called _key. This _key is not only used as a unique key for the v-for but also as an identifier when drawing links with SVG and d3. When the dataset changes the draw method is called but addUniqueKey is not. If any new nodes have been added to the dataset they will not have a _key and the warning will be thrown. This may cause the card rendering error and d3 may not be able to identify the link to draw.

The most efficient solution might be to call addUniqueKey each time the dataset changes but modify it to check if each node already has a _key and not recreate it if it does. I might create a pull request for this a little later.

jackieha commented 3 years ago

请问这个问题解决了吗？急需该功能

Maxim-Durand commented 3 years ago

This issue should've been fixed with 0eff2fd1a4adc55803d5df80cd454178a0e1ca46.

Please try to pull latest version and see if it's still an issue.

ssthouse / tree-chart

Not working with computed dataset #15