vue el-tree 新增节点后不闪烁

在使用 Vue 的 el-tree 组件时，如果新增节点后出现闪烁现象，可以尝试在新增节点之后手动调用 $nextTick 来更新视图。

示例代码：

methods: {
    addNode() {
        // 新增节点的逻辑
        ...
        this.$nextTick(() => {
            this.$refs.tree.doLayout();
        });
    }
}

`$nextTick` 函数会在下一次 DOM 更新循环结束之后执行回调函数，可以在新增节点之后立即更新视图，解决闪烁问题。`doLayout` 是 el-tree 提供的一个方法，用来重新渲染树形组件，更新节点布局

注意，需要在template里给el-tree组件设置 ref

<el-tree ref="tree" :data="treeData"></el-tree>

相关问题

vue el-tree新增节点后不折叠刷新

在 Vue 项目中使用 el-tree 新增节点后如果不想自动折叠，可以在新增节点后手动调用 el-tree 的展开方法，例如 `$refs.tree.expandNode(node)`。

如果你想让 el-tree 新增节点后自动展开，可以在 el-tree 上设置 `default-expand-all` 属性为 true。

之后刷新树形结构可以使用 $forceUpdate() 一般使用在父组件上的ref来调用,然后触发更新树形结构。

this.$forceUpdate()

或者

this.$refs.tree.doLayout()

如果你想在新增节点后让树展开到新增节点的位置，可以使用 `expandNode(node)` 方法让树展开到新增节点的位置。

this.$refs.tree.expandNode(node)

其中 `node` 为新增的节点对象。

vue el-tree 新增节点复选框自动勾选

在 Vue 中使用 el-tree，新增节点时要使复选框自动勾选，可以在新增节点时将节点的 `checked` 属性设置为 `true`。例如：

this.treeData.push({
    id: 3,
    label: '新增节点',
    checked: true
});

这样，新增的节点的复选框就会被勾选上。如果新增节点在树结构中有父节点，需要保证父节点已经被插入到树结构中。如果新增节点有多个父节点，需要保证这些父节点都已经被插入到树结构中。