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

在 Vue 中使用 el-tree 新增子节点时，可以通过在新增节点时给它的父节点设置 "indeterminate" 状态来实现自动勾选。还可以在父节点的 "change" 事件中调用递归函数来更新父节点的状态。

相关问题

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

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

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

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

在vue中，el-tree新增节点默认勾选复选框

在 vue 中使用 el-tree 组件新增节点并默认勾选复选框，可以使用以下方法：

1. 在 el-tree 组件的 data 属性中，为新增的节点添加 checked 属性，并设置为 true，例如：

data: [
  {
    id: 1,
    label: '节点 1',
    children: [
      {
        id: 2,
        label: '节点 2',
        checked: true
      }
    ]
  }
]

2. 使用 el-tree 组件的 node-key 属性，并在 data 属性中为新增的节点添加该属性的值，例如：

node-key: 'id',
data: [
  {
    id: 1,
    label: '节点 1',
    children: [
      {
        id: 2,
        label: '节点 2'
      }
    ]
  }
]

然后，在 el-tree 组件的 ref 属性中，使用 this.$refs.tree.setCheckedNodes([{ id: 2 }]) 方法将新增的节点设为勾选状态。

this.$refs.tree.setCheckedNodes([{ id: 2 }])

请注意，在使用 setCheckedNodes 方法时，需要保证 el-tree 组件已经渲染完毕，因此通常需要在 mounted 钩子函数中使用。

mounted () {
  this.$refs.tree.setCheckedNodes([{ id: 2 }])
}