vue.js：带有组件的树形视图

Question

是否可以添加带有组件的树here？ 我的组织结构包括组织，组织单位和部门。我想让他们表现得井井有条。

临时看起来像这样：

一个输入组示例：

<b-input-group prepend="Org">
     <b-form-input v-model="org.name"></b-form-input>
     <b-input-group-append>
         <b-btn variant="outline-danger">Delete</b-btn>
         <b-btn v-on:click="editOrg(org.id, org.name)" variant="outline-success">Save</b-btn>
     </b-input-group-append>
</b-input-group>

Answer 1

是的，最近我使用递归组件创建了一个拖放菜单构建器。这是一个很好的教程，可以指导您完成该部分的操作：https://alligator.io/vuejs/recursive-components/

一旦了解了递归组件的工作方式，就应该能够构建数组并嵌套所需的任何内容，即列表中的<input>元素。然后只需通过键引用输入，即可将输入绑定到数组中的项目。