网站底部备案号,个人网站设计论文摘要关键词,本地app制作公司电话,儿童摄影网站怎么做项目场景#xff1a;使用el-tree组件#xff0c;搜索后动态设置数据全部展示 问题描述
el-tree动态设置是否全部展开属性#xff0c;值已经改变#xff0c;但是没有展开 el-selectv-modelTableNameplaceholder请选择el-input placeho…项目场景使用el-tree组件搜索后动态设置数据全部展示 问题描述
el-tree动态设置是否全部展开属性值已经改变但是没有展开 el-selectv-modelTableNameplaceholder请选择el-input placeholder请输入关键词 v-modelinputValue maxlength40i slotsuffix classel-input__icon el-icon-search clickgetTreeData/i/el-inputel-option :valueTableName styleheight: 200px; overflow-y: autoel-treev-loadingloading:datatreeData:indexindex:propsdefaultProps:default-expand-allexpandAllnode-keypuidhighlight-currentnode-click(data, node, item) handleNodeClick(data, node, item, index, tableName)//el-option/el-selectexpandAll动态设置值为true false值已经改变树节点却没有展开
原因分析
default-expand-all属性在第一次渲染时才生效动态改变后树早已渲染出来所以需要等数据出来后重新渲染 解决方案
加个 v-ifrefreshTreeel-tree reftreev-loadingloading:datatreeData:indexindex:propsdefaultProps:default-expand-allexpandAllnode-keypuidhighlight-currentv-ifrefreshTreenode-click(data, node, item) handleNodeClick(data, node, item, index, tableName)/父组件请求接口后处理this.$refs.tree.refreshTree false;this.$refs.tree.expandAll inputValue ? true : false;//这里我是根据输入框是否有值判断是否是搜索后大家可以酌情处理this.$refs.tree.$nextTick(() {this.$refs.tree.refreshTree true;});