点击树后有 通过ref调用表格刷新方法?,或者完整的代码复制出来我看看
<template>
<div>
<el-card>
<template #header>
<span>文件管理</span>
</div>
</template>
<div style="min-height: 450px">
<div class="flex-basis-180px flex-shrink-0">
<avue-tree
ref="tree"
:option="treeoption"
:data="treeData"
v-model="form"
@node-click="nodeClick"
>
</avue-tree>
<div style="max-width: calc(100% - 220px)">
<LowTable ref="fileTableRef"
tableId="1917144882454827009"
:enhanceData="{ type:'treeview' }"
:fixed-search="{ document_directory: treeVal }"
</LowTable>
</el-card>
<script setup>
import { listToTree } from '@/utils/tree'
import { LowTable } from '@/components/LowDesign/index'
import { ElMessage } from 'element-plus'
import * as TableApi from '@/api/design/table'
const form = ref({})
const treeVal = ref('')
const treeData = ref([])
const treeoption = ref({menu: false})
const fileTableRef = ref()
const nodeClick = (data) => {
treeVal.value = data.value
if(fileTableRef.value?.resetChange){
fileTableRef.value.resetChange()
}
// 组件挂载完成后加载数据
onMounted(() => {
loadTreeData()
})
// 获取数据并赋值
const loadTreeData = async () => {
try {
const res = await TableApi.getTableList('1917159226710265858', {}, false)
const treeDatas = listToTree(res.records) // 将结果赋值给 treeData
treeData.value = convertToValueLabelTree(treeDatas);
} catch (error) {
ElMessage.error('加载树形数据失败')
console.error(error)
// 转换函数:将后端数据转为 { value, label, children } 结构
const convertToValueLabelTree = (data) => {
if (!Array.isArray(data)) return []
return data.map(item => ({
value: item.directory_name,
label: item.directory_name,
children: item.children ? convertToValueLabelTree(item.children) : []
}))
</script>
<style scoped>
::v-deep(.el-card) {
&.card-box {
border-radius: 10px;
.el-card__header {
font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑', sans-serif;
font-size: 15px;
font-weight: 700;
color: #666;
background-color: #f9f9f9;
// .el-card__body { }
::v-deep(.el-tree) {
.el-tree-node.is-current > .el-tree-node__content {
background-color: white;
.el-tree-node__content {
height: 40px;
.el-tree-node__expand-icon {
font-size: 16px;
.el-tree-node__label {
font-family: '微软雅黑', sans-serif;
</style>
这个是全部代码
还有个问题,我在表单开发-查询属性中选择了查询属性,但是页面表头没有查询条件框麻烦有空一起帮忙看看,版本是2.0的 谢谢
这里应该没复制到 data.value是空的,你可以打印看看,空值搜索是不会带的
搜索的问题我这边没复现,可以在演示环境复现一下么
这个是我js里面有控制,我删除了一些js,查询条件框就有了。。但是那个data.value,我测试时:fixed-search="{ document_directory: 'aaaa'}" 这个写死也没有用
大概率是你增强问题,我用你代码把表id改成示例的单表和树表是可以的
我正在参加 Gitee 2025 最受欢迎的年度开源软件投票活动,请为 JeeLowCode 投上宝贵一票。
点击树后有 通过ref调用表格刷新方法?,或者完整的代码复制出来我看看