vue树形组件递归,每次修改任意一个叶子，都必须触发把节点组装为树的函数吗？是不是效率有点低？

Question

服务器回来的是扁平数组， 组装成一个树形根节点，这个步骤Fn函数实现。

组件递归后， 每一个叶子节点可编辑。

那么每次编辑，都要重新执行一次 Fn吗？

是否效率低？

如代码：

换一种说法介绍一下：
从服务器拉取一次数据后。因为vue组件不能双向修改自己本身的节点数据，叶子组件修改了数据，要把新数据发给根组件，根组件才有权利更新根数据。所以怀疑效率。

相比一下，请问 叶子节点 直接修改自己的props 是否合理和高效。

Answer 1

每个叶子是一个Object 引用类型。 所以根组件里只更新 对应的某个叶子的数据就行。不必重复执行Fn。

Answer 2

你每次刷新数据都往后端请求的话，确实无法避免。但是不用担心的是，Fn这个函数如果写成O(n)复杂度的话，反正数据量不上10w都是毫秒级别完成，完全不用担心效率问题。——效率确实低，但是可以不在这上面浪费时间

Answer 3

这是最简单的方式.
如楼上所说,其实不需要在这里费太多精力.纯js运算,不会耗费太多时间.
而vue自身有优化,即便数据发生了变化,也会只更新变化的dom.

如果非要优化,可以在fn中为每个节点加上路径,然后修改某个节点时,将新值与路径一起交给父组件,父组件根据路径直接去修改指定值,这样可以节约一些时间.