@Zt448143356

这是用法上的问题。这里涉及到vue2的更新渲染机制。你有空可以了解下vue2的更新渲染机制。

已知信息： edges是一个数组，

在vue2中，你去更新数组中的某一项参数，直接更新是无效的。数据变了但是不会触发渲染。

推荐你看下这几篇文章：（vue2的）

数组文章： https://segmentfault.com/a/1190000038142224
渲染机制文章： https://v2.cn.vuejs.org/v2/guide/reactivity.html

看完你应该就知道怎么写了。

@Zt448143356 这些文档学习vue时看过了,一开始就是按照vue的推荐语法更新,但实际与vue描述不符,渲染未生效. 目前采用的下标语法是参考贵插件的vue版的example中的nodes数组更新代码. 我自己开发时nodes数组也确实可以通过下标进行更新数据并触发渲染. 但edges未触发.

怎么可能，吓得我马上自己去写了一份。没有问题啊。兄弟你在看看,是我对vue2的数组更新的理解和你的理解有出入吗？

vue2的数组是重写了它的数组操作方法，你用重写的数组操作方法去操作数组就会触发vue的渲染机制的。你看看你的理解和我的一致不。那个第一篇文章就讲述了这个观点。

addEdge() {
      this.mockData.edges.push({
        id: '1.right-4.right',
        sourceNode: '1',
        targetNode: '4',
        source: 'right',
        target: 'right',
      })
      this.addEdgeEnable = true;
    },
    editEdge() {
      this.mockData.edges.splice(0, 1, {
        id: '1.right-4.left',
        sourceNode: '1',
        targetNode: '4',
        source: 'right',
        target: 'left',
        render: '<div>编辑线</div>'
      })
    },

我就demo基础里改了一点东西，你也可以自己改一下试试。

很奇怪了，我的就是不生效。

我用您上方的例子和vue的demo代码后确实可以修改成功，但我对您的方法修改成以下图片后界面不会更新，重绘才可更新。麻烦您解答下是我对更新理解的不对吗

数据更新问题我还是无法得到好的解决在尝试edge和group中都有此问题，举例：对于groups调整大小设置宽高，尝试过数组更新方法，也尝试过用$set设置。达到的效果要么是界面不更新，要么是界面更新了实际节点组的width和height未更新（请观看下方gif）令我无法灵活运用数据更新界面。