-
Notifications
You must be signed in to change notification settings - Fork 319
Open
Labels
bugSomething isn't workingSomething isn't working
Description
Version
3.24.0
Vue Version
3.5.17
Link to minimal reproduction
Step to reproduce
<template>
<div>
<tiny-form model="value4" :rules="{
city: [{required: true, message: '城市不能为空'}]
}">
<tiny-form-item prop='city' label="城市">
<tiny-select
v-model="value4.city"
placeholder="请输入关键词"
multiple
reserve-keyword
filterable
remote
render-type="grid"
:remote-method="remoteMethod"
:grid-op="gridOpMultiple"
:remote-config="{ autoSearch: true, clearData: true, showIcon: true }"
></tiny-select></tiny-form-item>
</tiny-form>
</div>
</template>
<script setup>
import { ref } from 'vue'
import { TinySelect, TinyForm, TinyFormItem } from '@opentiny/vue'
const allData = Array.from({ length: 20 }, (a, i) => {
return {
value: '00' + i,
province: '省份 ' + i,
city: '城市 ' + i,
area: '区域 ' + i,
label: `省 ${i}-市 ${i}`
}
})
const baseGridOp = {
data: [],
height: 300,
optimization: {
animat: true,
delayHover: 250,
scrollX: { gt: 20 },
scrollY: { gt: 20 }
}
}
const baseCols = [
{ field: 'province', title: '省份' },
{ field: 'city', title: '城市' },
{ field: 'area', title: '区域' }
]
const value4 = ref({
city:[]
})
const gridOpRadio = {
...baseGridOp,
columns: [{ type: 'radio', title: '' }, ...baseCols]
}
const gridOpMultiple = {
...baseGridOp,
columns: [{ type: 'selection', title: '' }, ...baseCols]
}
const filter = (value) => {
return allData.filter((item) => item.city.includes(value))
}
const remoteMethod = (value) => {
const filterData = filter(value)
return new Promise((resolve) => {
setTimeout(() => {
resolve(filterData)
}, 500)
})
}
</script>
<style scoped>
.tiny-select {
width: 280px;
}
p {
font-size: 14px;
line-height: 1.5;
}
</style>
官方演练场复现代码
What is expected
No response
What is actually happening
No response
What is your project name
内部项目
Any additional comments (optional)
No response
Metadata
Metadata
Assignees
Labels
bugSomething isn't workingSomething isn't working