【优化】解决前端下拉选框不跟随页面滚动导致与选框分离的问题

pull/215/head v3.0.2
俞宝山 2024-05-28 02:10:45 +08:00
parent 1a9550e528
commit 6db3a696f0
7 changed files with 37 additions and 7 deletions

View File

@ -9,7 +9,12 @@
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-item label="分类" name="category"> <a-form-item label="分类" name="category">
<a-select v-model:value="searchFormState.category" placeholder="请选择分类" :options="categoryOptions"> <a-select
v-model:value="searchFormState.category"
placeholder="请选择分类"
:options="categoryOptions"
:getPopupContainer="(trigger) => trigger.parentNode"
>
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
@ -89,7 +94,7 @@
} }
// //
const reset = () => { const reset = () => {
searchFormRef.value.resetFields(); searchFormRef.value.resetFields()
tableRef.value.refresh(true) tableRef.value.refresh(true)
} }
// //

View File

@ -27,7 +27,11 @@
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-item name="userStatus" :label="$t('user.userStatus')"> <a-form-item name="userStatus" :label="$t('user.userStatus')">
<a-select v-model:value="searchFormState.userStatus" :placeholder="$t('user.placeholderUserStatus')"> <a-select
v-model:value="searchFormState.userStatus"
:placeholder="$t('user.placeholderUserStatus')"
:getPopupContainer="(trigger) => trigger.parentNode"
>
<a-select-option v-for="item in statusData" :key="item.value" :value="item.value">{{ <a-select-option v-for="item in statusData" :key="item.value" :value="item.value">{{
item.label item.label
}}</a-select-option> }}</a-select-option>

View File

@ -8,6 +8,7 @@
v-model:value="searchFormState.engine" v-model:value="searchFormState.engine"
:options="engineOptions" :options="engineOptions"
placeholder="请选择邮件引擎" placeholder="请选择邮件引擎"
:getPopupContainer="(trigger) => trigger.parentNode"
allow-clear allow-clear
></a-select> ></a-select>
</a-form-item> </a-form-item>

View File

@ -10,7 +10,12 @@
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-item name="engine" label="存储位置"> <a-form-item name="engine" label="存储位置">
<a-select v-model:value="searchFormState.engine" placeholder="请选择存储位置" :options="engineOptions" :getPopupContainer="(trigger) => trigger.parentNode"/> <a-select
v-model:value="searchFormState.engine"
placeholder="请选择存储位置"
:options="engineOptions"
:getPopupContainer="(trigger) => trigger.parentNode"
/>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">

View File

@ -9,12 +9,22 @@
</a-col> </a-col>
<a-col :span="6"> <a-col :span="6">
<a-form-item label="分类" name="category"> <a-form-item label="分类" name="category">
<a-select v-model:value="searchFormState.category" placeholder="请选择分类" :options="categoryOptions" /> <a-select
v-model:value="searchFormState.category"
placeholder="请选择分类"
:options="categoryOptions"
:getPopupContainer="(trigger) => trigger.parentNode"
/>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="6"> <a-col :span="6">
<a-form-item label="状态" name="jobStatus"> <a-form-item label="状态" name="jobStatus">
<a-select v-model:value="searchFormState.jobStatus" placeholder="请选择状态" :options="jobStatusOptions" /> <a-select
v-model:value="searchFormState.jobStatus"
placeholder="请选择状态"
:options="jobStatusOptions"
:getPopupContainer="(trigger) => trigger.parentNode"
/>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="6"> <a-col :span="6">

View File

@ -8,6 +8,7 @@
v-model:value="searchFormState.engine" v-model:value="searchFormState.engine"
:options="engineOptions" :options="engineOptions"
placeholder="请选择短信引擎" placeholder="请选择短信引擎"
:getPopupContainer="(trigger) => trigger.parentNode"
allow-clear allow-clear
></a-select> ></a-select>
</a-form-item> </a-form-item>

View File

@ -27,7 +27,11 @@
</a-col> </a-col>
<a-col :span="8"> <a-col :span="8">
<a-form-item name="userStatus" :label="$t('user.userStatus')"> <a-form-item name="userStatus" :label="$t('user.userStatus')">
<a-select v-model:value="searchFormState.userStatus" :placeholder="$t('user.placeholderUserStatus')"> <a-select
v-model:value="searchFormState.userStatus"
:placeholder="$t('user.placeholderUserStatus')"
:getPopupContainer="(trigger) => trigger.parentNode"
>
<a-select-option v-for="item in statusData" :key="item.value" :value="item.value">{{ <a-select-option v-for="item in statusData" :key="item.value" :value="item.value">{{
item.label item.label
}}</a-select-option> }}</a-select-option>