引言
在使用 BasicTable 时，开启表单搜索，若我们需要更为灵活的下拉框，比如查询的默认值绑定变量、级联选择等，使用 slot插槽 会是一种解决方法。
使用
默认值绑定变量
在searchFormSchema中，添加slot
...
{
label: '排课计划',
field: 'sessionId',
component: 'JInput',
colProps: { span: 6 },
slot: 'sessionId',
},
...
在 BasicTable 内部引入该插槽（BasicTable内部的搜索表单需要添加form-前缀）
...
<template #form-sessionId="{model, field}">
<a-select
v-model:value="sessionId"
:options="sessionList"
@change="handleChange(model, field)"
show-search
/>
</template>
...
定义handleChange逻辑，即可绑定默认值到变量上。
function handleChange (data, field) {
data[field] = sessionId.value;
}
本质上来说是对浅拷贝的一种应用：修改
data对象本身。
另外，如果你期望避免BasicTable在未获取到默认值前的冗余加载，可以
const {prefixCls, tableContext} = useListPage({
...
beforeFetch: (params) => {
params.sessionId = sessionId.value
},
immediate: false,
...
})
在加载到变量值之后，执行reload即可
因为
handleChange需要点开选择框选择才能触发。beforeFetch内部函数的处理，是为了首次加载到变量值后，在未触发handleChange的情况下，依然可以正常将查询参数绑定。
级联选择
若涉及到多个选择框的级联，我们也可以使用如上方法绑定的变量，按条件渲染不同的option甚至不同的组件
例如：
...
<template #form-params="{ model, field }">
<span v-if="modelName==='A'">
<SelectA :params="model[field]" @updateParam="(val) => updateParam(model, field, val)"/>
</span>
<span v-else-if="modelName==='B'">
<SelectB :params="model[field]" @updateParam="(val) => updateParam(model, field, val)"/>
</span>
<span v-else-if="modelName==='C'">
<SelectC :params="model[field]" @updateParam="(val) => updateParam(model, field, val)"/>
</span>
<span v-else>
<a-input placeholder="请输入" v-model:value="model[field]"/>
</span>
</template>
...
对应的updateParam
function updateParam(model, field, val) {
model[field] = val;
}
