antd Tree 获取当前节点以及所有上级父节点的id |
您所在的位置：网站首页 › angular10怎么获取根结点的样式 › antd Tree 获取当前节点以及所有上级父节点的id |
|
项目需求：一个产品树，当点击一个节点的时候获取当前节点以及所有父级节点的id，并调用兄弟组件(form组件)的方法进行查询操作，查询的结果需要渲染在table组件中。 1.首先明确这个页面的组件结构，是由 Tree、Form、Table组件组成。 // index.js 父组件 { flex: '1' }}> // 在Tree和Form组件中在componentDidMount生命周期中把自己传给父组件 // Tree组件中 componentDidMount() { this.props.treeRef && this.props.treeRef(this); } // 在点击树节点的时候 //点击树节点时触发 onSelect = (selectKeys, e) => { const { dispatch } = this.props; const { commodity: { treeData }, } = this.props; this.setState({ selectedKeys: selectKeys, }); let arrKeys = {}; //只有节点选中了才执行代码 if (e.selected && e.node.props.dataRef.param !== 'categoryId') { keysObj = {}; firstParentKey = {}; arrKeys = getParentKey(selectKeys, treeData); } else if (e.selected && e.node.props.dataRef.param === 'categoryId') { //点击的是一级根节点 keysObj = {}; firstParentKey = {}; arrKeys = { categoryId: e.node.props.dataRef.paramId, }; } else if (!e.selected) { this.setState({ selectedKeys: [], }); return false; } this.props.idObject(arrKeys); // 将获取到的所有父级id传给父组件 }; // Form组件中 componentDidMount() { this.props.onRef && this.props.onRef(this); }
|
今日新闻 |
推荐新闻 |
| CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |