Antd Tree组件Tree props#属性 checkStrictly

最新推荐文章于 2024-05-08 14:55:00 发布
最新推荐文章于 2024-05-08 14:55:00 发布
阅读量5.5k 收藏 1
点赞数 1
分类专栏： 前端开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hzxOnlineOk/article/details/98224369
版权

Antd 3.20.7 版本 Tree组件Tree props#属性 checkStrictly 值为true，则点击选中树?子节点时，不会联动选中父节点，而父节点选中也不会默认把所有子节点选中：

 

hzxOnlineOk
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
Element-UI 中 el-table 树形数据 tree-props使用避坑
web15870359587的博客
03-08 5069
element官网提示设置tree-props为{children: 'children',hasChildren: 'hasChildren'}，data数据需要设置children和hasChildren属性，row-key也绑定了数据的唯一值变量id，但是树形结构就是出不来 在el-table中，支持树类型的数据的显示。当 row 中包含 children 字段时，被视为树形数据。渲染树形数据时，必须要指定 row-key。支持子节点数据异步加载。 设置 Table 的 lazy 属性为 true.
React antd 树组件自定义父子节点交互逻辑（包括全选，半选，全不选三种状态）使用checkStrictly使父子节点状态不再受控
m0_71630007的博客
04-13 2891
先使用checkStrictly使父子节点状态不再受控，checkedKeys属性有两个参数可以用来控制全选和半选状态（checked是所有勾选中的id，halfChecked是半选的id），通过setCheckedKeys来控制状态即可。4. 子节点全部勾选，子节点最近一级的父节点是全选状态（再上一级根据旗下的子节点是否全选进行判断，以此类推...）；5. 子节点全部取消勾选，父节点不取消，呈半选状态。2. 父节点选中为勾选状态，子节点全部勾选；1. 父节点选中为半选状态，子节点不选中；
avue-crud属性配置项参数
最新发布
xiaowei66的博客
05-08 1364
group: [label: '基本信息',column: [label: "主体类型",span: 8,},label: "主体名称",span: 8,},label: '申请信息',span: 8,column: [label: "申请类型",span: 8,},
vue---element中el-tree树形结构的check-strictly属性
maidu_xbd的博客
01-09 6131
check-strictly用于设置在复选框选择时，父子是否关联显示，其值默认为false，为关联显示状态。 当设置【check-strictly="true"】时，效果如下： ...
【记录】记录一下element-ui级联选择器设置了checkStrictly后点击整行都可选中的优化
z13540112421的博客
04-23 436
使用的vue2.7,所以是组合式api方法。
el-table树形数据序号展示
niuniu2878499107的博客
01-12 935
el-table树形数据序号展示。
antd Tree组件 搜索标红 例子
09-09
antd 的Tree组件带搜索，搜索内容标红
antd-tree.zip
07-24
antd-tree.zip 文件是一个包含使用ANT Design（简称antd）框架中的Tree组件的项目压缩包。antd是基于React的UI库，提供了丰富的组件供开发者构建前端应用。在这个项目中，重点是实现Tree组件的选择控制，以及选中...
如何实现vue的tree组件
01-18
Tree一直是大家熟知的组件，做一些大型的后台管理系统都会用到。使用树组件可以完整的展现其中的层级关系，并具有展开收起选择等交互功能。 效果 节点可以无限的递归延伸 可以展开和收起子节点 如果子节点全部选择...
可自定义树节点的Tree组件
03-20
- **数据模型**：理解组件的数据结构，如节点对象包含哪些属性和方法，如何表示父子关系。 - **渲染逻辑**：查看源码中的渲染过程，了解如何将数据转换成可视化的树结构。 - **扩展接口**：寻找组件提供的扩展点...
react-mobx-state-tree-demo:利用react，mobx-state-tree和一些antd组件
05-15
在本项目"react-mobx-state-tree-demo"中，开发者运用了React、MobX状态树（mobx-state-tree）以及Ant Design组件库，构建了一个演示应用。这个应用旨在展示如何将这些技术有效地结合在一起，实现一个功能完备且易于...
antd树型选择控件选择父级_react+antd 递归实现树状目录操作
weixin_29699041的博客
02-15 1414
1.写在前面作为前端小白的我一直对算法和数据结构浅尝辄止，哝，吃亏了。使用多次递归实现数据格式化后将数据进行树状展示的目的，分享一下我这次挠头的经历~2.数据后台传过来的数据大概是这样的{"data":[{"id":1,"name":"一级节点","parentId":0,"isValid":true,"canAddChild":true,"parent":null,"children":[]},...
antd design TreeSelect 改造
junner443的博客
01-05 651
antd design TreeSelect 改造 1.背景 对于部门树组件，
antd级联选择器（a-cascader）动态加载和动态回显效果实现
zzzz121380的博客
12-06 1万+
​ 需要实现级联选择器动态拿到每一层级的数据并显示，同时在编辑数据时弹框回显对应的层级关系。​ 给组件添加 这个属性就可以实现单独勾选一级、二级、三级组织关系。（官方api没有写）​ 首先先在html里 模态框上写上a-cascader组件 （2）data数据 （3）实现动态加载数据 ​ 先实现只有动态加载数据的功能（根据官网https://1x.antdv.com/components/cascader-cn/示例即可实现） 2、methods方法 注意：（初始化时会先获取第一层级的数据） 3、
antd的tree树形组件异步加载数据小案例
热门推荐
大鱼吃小鱼7的博客
10-30 2万+
前不久，做业务需求时遇到一个树形选择的 问题 ， 子节点的数据要通过点击展开才去加载，在antd给出的官方文档中也有关于动态加载数据的demo，然而不够详细，自己研究之后，整理出来共享给大家借鉴下。 view.jsx（纯函数式声明） // 渲染树的方法 const loop = data => data.map((item) => { const index = item.r...
vue el-tree树形结构的check-strictly属性
且听风吟的博客
08-19 2万+
Tree 树形控件
layui树形父子不关联_[antd] Tree 组件实现父子节点分离 (父子节点不相互关联)
weixin_39864101的博客
12-31 1184
[antd] Tree 组件实现父子节点分离 (父子节点不相互关联)项目中我们遇到 Tree 组件的时候, 默认的选中父节点的时候是相互关联的效果, 如下图:屏幕快照 2019-08-05 下午 4.59.37.PNG上图点击原子零件的时候下面的都会勾选中, 但是, 有的时候需要使得勾选父节点的时候不会影响到子节点, 即勾选子节点的时候也要勾选上父节点给后台传过去WeChat2cee7be8260...
antd异步加载的树
weixin_30532369的博客
10-19 873
1.antd异步加载的使用方法： <Tree checkable //加入checkbook checkStrictly //父子节点是否关注 onCheck={onCheck} //点击事件 loadData={this.onLoadData1}//这是很关键的一部调用异...
antd tree组件使用expandedKeys无法收起
09-14
### 回答1： 可能是因为 `expandedKeys` 属性被设置为不可变值（如常量或全局变量），而在组件内部无法修改其值。请确保 `expandedKeys` 属性是可变值（如 state 或 props），并在组件内部正确更新其值。 ### 回答2： antd 的 Tree 组件使用 expandedKeys 属性来控制展开的节点，如果无法收起节点，可能有以下几个原因： 1. expandedKeys 属性没有正确设置：检查代码中的 expandedKeys 属性是否设置正确。确保传递给 expandedKeys 的值是当前需要展开的节点的 key 的数组。如果 expandedKeys 属性没有设置或者传递的值不正确，就无法正常展开或收起节点。 2. onChange 事件没有正确处理：Tree 组件提供了 onChange 事件来处理节点的展开和收起操作。检查代码中的 onChange 事件处理函数是否正确，并且在函数中更新 expandedKeys 的值。如果没有正确处理 onChange 事件，就无法将展开或收起的节点更新到 expandedKeys 中。 3. 树节点数据结构不正确：检查传递给 Tree 组件的数据的结构是否正确。确保每个节点的 key 属性是唯一的，并且将需要展开的节点的 key 值正确传递给 expandedKeys。如果节点数据结构不正确，就无法正常展开或收起节点。 请仔细检查以上几个方面，并对相关代码进行调试和测试，以解决无法收起节点的问题。如果问题仍然存在，可以参考 antd Tree 组件的官方文档或提问相关技术社区获取更多帮助。 ### 回答3： antd tree组件的`expandedKeys`属性是用来控制展开节点的，通过设置该属性的值为一个数组，数组中的元素为节点的key值，可以实现默认展开节点或者通过操作来展开或收起节点。 如果在使用`expandedKeys`属性后，无法实现收起节点的功能，可能有以下几个原因： 1. `expandedKeys`属性的值未正确设置：首先要确保`expandedKeys`属性的值为空数组（即`[]`），这样所有的节点都是收起状态。如果想要某个节点默认展开可以将其对应的key值添加到`expandedKeys`数组中。 2. 错误修改`expandedKeys`属性的值：如果尝试通过修改`expandedKeys`属性的值来实现节点的展开和收起，可能是因为未正确处理`expandedKeys`属性的变化。在修改`expandedKeys`属性后，需要更新`expandedKeys`属性的值来触发组件重新渲染。 3. 组件未正确引用：在使用`Tree`组件时，要确保引入的是正确版本的组件。可能是因为引用的组件版本有问题，导致无法正常工作。 针对以上原因，可以按照以下步骤来解决问题： 1. 检查`expandedKeys`属性的值是否正确设置。 2. 在修改`expandedKeys`属性后，检查是否正确更新`expandedKeys`属性的值。 3. 确保正确引入了antd tree组件，如果不确定可以尝试更新组件版本。 如果经过以上步骤仍然无法解决问题，建议查看antd官方文档、社区或提问反馈给antd团队以寻求进一步的帮助和解决方案。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

hzxOnlineOk

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值