<template #default="{ node,data }">
<template>
<el-dialog
v-model="dialogVisible" :title="title" :width="width" :close-on-click-modal="false"
:close-on-press-escape="false" @close="dialogClose" @open="dialogOpen">
<BasicForm
ref="basisFormRef" label-width="100px"
:item="form_config.form_item"
:button="form_config.form_button"
:field="form_config.form_data"
:loading="form_config.form_loading"
@callback="handlerSubmit"
>
<template v-slot:permit>
<el-tree
:data="datas.tree_data"
show-checkbox
node-key="menu_id"
default-expand-all
:expand-on-click-node="false"
>
<template #default="{ node,data }"> <!--此处的data应该是el-tree中的:data-->
<div>
<div><strong>{{ data.menu_name }}</strong></div>
</div>
</template>
</el-tree>
</template>
</BasicForm>
</el-dialog>
</template>
<template #default="{ node,data }"> 是 Vue.js 中的一个作用域插槽的用法。它允许你自定义组件的内容,通过传入你自己的模板。在这个例子中,它被用来自定义 el-tree 组件中每个节点的内容。
#default 是插槽的名称。如果没有提供名称,那么它就被认为是默认插槽。
"{ node,data }" 是一个解构赋值,用来从插槽的作用域中提取 node 和 data 属性。这些属性由 el-tree 组件提供,代表当前的树节点和其关联的数据。
在这个插槽内部,你可以使用这些属性来显示每个树节点的自定义内容。在你的代码中,你正在显示 data 对象的 menu_name 属性。