javascript - uniapp的tki-tree组件子级不显示？
uniapp的tki-tree组件子级不显示，我复制了别人一模一样的代码还是一样呀，请大家看看这有什么问题？
<template> <view class="content"> <button type="primary" @tap="showTree">显示树形选择器</button> <text>一些参数</text> <button type="primary" @tap="multiple = !multiple">切换单、多选：{{multiple?'多选':'单选'}}</button> <button type="primary" @tap="flod = !flod">折叠已打开的子集：{{flod?'折叠':'不折叠'}}</button> <button type="primary" @tap="selectParent = !selectParent">切换父级可选：{{selectParent?'可选':'不可选'}}</button> <tki-tree ref="tkitree" :selectParent="selectParent" :multiple="multiple" :range="list" :foldAll="flod" rangeKey="name" @confirm="treeConfirm" @cancel="treeCancel"></tki-tree> </view></template><script> import tkiTree from '@/components/tki-tree/tki-tree.vue'; let testList = [{ id: 1, name: '北京市', children: [{ id: 11, name: '市辖区', children: [{ id: 111, name: '西城区', children: [{ id: 1111, name: '南河沿大街', children: [{ id: 11111, name: '紫金宫饭店', checked: true }, ] }, ] }, { id: 112, name: '东城区', }, { id: 113, name: '朝阳区', }, { id: 114, name: '丰台区', } ] }, ] }, { id: 2, name: '河北省', children: [{ id: 21, name: '石家庄市', }, { id: 22, name: '唐山市', }, { id: 23, name: '秦皇岛市', }, ] }, { id: 3, name: '山东省', children: [{ id: 31, name: '济南市', children: [{ id: 311, name: '历下区', children: [{ id: 3131, name: '解放路街道办事处', }, ] }, { id: 312, name: '槐荫区', }, { id: 313, name: '天桥区', }, { id: 314, name: '历城区', }, { id: 315, name: '长清区', } ] }, { id: 32, name: '青岛市', }, { id: 33, name: '临沂市', children: [{ id: 331, name: '兰山区', children: [{ id: 3331, name: '金雀山街道', }, ] }, { id: 332, name: '河东区', }, { id: 333, name: '罗庄区', children: [{ id: 3331, name: '盛庄街道', }, ] } ] }, { id: 34, name: '日照市', }, { id: 35, name: '淄博市', }, { id: 36, name: '枣庄市', }, { id: 37, name: '东营市', }, { id: 38, name: '潍坊市', }, { id: 39, name: '烟台市', }, { id: 40, name: '济宁市', }, { id: 41, name: '泰安市', }, { id: 42, name: '威海市', }, { id: 43, name: '滨州市', }, { id: 44, name: '菏泽市', }, ] }, { id: 4, name: '河南省', }, { id: 5, name: '湖北省', }, { id: 6, name: '湖南省', } ] export default { components: { tkiTree }, data() { return { list: [ ], multiple: false, selectParent: false, flod: true, } }, onLoad() { setTimeout(() => { this.list = testList; }, 300) }, methods: { // 确定回调事件 treeConfirm(e) { console.log(e) }, // 取消回调事件 treeCancel(e) { console.log(e) }, // 显示树形选择器 showTree() { this.$refs.tkitree._show(); }, } }</script><style></style>这是错误的效果图
共有1个答案
首先，我注意到你的代码中，rangeKey属性值为name，这应该是正确的，因为你在数据中也是使用name作为节点的标识。
然后，selectParent和multiple属性也看起来没有问题，因为你在代码中已经正确地将其设置为可变值。
接下来是flodAll属性，它被设置为true，意味着所有的子集都应该被折叠。如果这是你期望的行为，那么它也是正确的。
最后，你的数据testList看起来没有问题，它是一个包含多个节点的树形结构。
根据你给出的代码和描述，我无法直接确定问题出在哪里。这可能是因为某些其他代码或者组件的交互导致的。
你可以尝试以下步骤来调试这个问题：
- 检查
tki-tree组件的源代码，看看是否有任何明显的问题或者错误。 - 尝试在一个简单的例子中只使用你的数据和配置，看看是否可以正常显示子节点。
- 检查其他可能与
tki-tree组件交互的代码，看看是否有任何可能影响它的行为的地方。
如果你仍然无法解决问题，我建议你提供更多的信息，例如完整的错误消息、更多的相关代码或者更详细的描述，这样我才能更好地帮助你。
-
有一个父组件 A，上面有两个子组件，B 和 C。 在子组件 B 上有一个子组件 D，其中 D 里面有一个 textarea 在子组件 C 上有一个按钮，点击这个按钮获取 D 里面 textarea 的值。 我尝试的两个方案 方案一：可以通过直接操作 dom 来解决 方案二：通过 D 将 textarea 的值传递给 B，然后由 B 传给 A，再有 A 传给 C，但总是传不成功。 请问我的这个需求，
-
路径没错啊，就是在static目录下的 图片啊
-
如何让不同的分类展示不同的数据 我想让id为1的 显示在全部栏目下 id为2显示吃吃喝喝栏目下 因该怎么改
-
父级： 子组件： 如果使用withCtx(() => h('span', { class: 'span' }, '哈哈'), ins)是可以让span的scopeId和父级一致，但是这样必须在每个使用了子组件的父级里写一遍，太麻烦还容易漏，官方文档根本没写这东西 所以有没有一种方式，能通过修改子组件，父级不需要传其他乱七八糟的比如instance之类的给子组件，就能达到说子组件接收的render函
-
本文向大家介绍Vue.js组件tree实现省市多级联动，包括了Vue.js组件tree实现省市多级联动的使用技巧和注意事项，需要的朋友参考一下 小颖在上一篇随笔中写了两级的tree，下面给大家再分享一下用<ul><li>标签实现省市多级联动。 调用示例: 组件代码: 效果图： 本文已被整理到了《Vue.js前端组件学习教程》，欢迎大家学习阅读。 以上就是本文的全部内容，希望对大家的学习有所帮助，
-
我正在尝试制作一个很好的ApiWrapper组件来填充各种子组件中的数据。从我读到的所有内容来看，这应该是可行的:https://jsfidle.net/vinniejames/m1mesp6z/1/ 但由于某种原因,当父状态更改时,子组件似乎没有更新。 我是不是漏了什么？