fix(components): [select] Fix value with value-key not selected (#15681)

* fix(components): [select] Fix value with value-key not selected

* test(components): add test

* test(components): update
This commit is contained in:
kooriookami 2024-01-30 09:40:49 +08:00 committed by GitHub
parent a6a22dfc6a
commit 4b56cf68f6
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 31 additions and 3 deletions

View File

@ -515,6 +515,34 @@ describe('Select', () => {
expect(wrapper.find(`.${PLACEHOLDER_CLASS_NAME}`).text()).toBe('Option D')
})
test('set default value to object with value-key', async () => {
wrapper = _mount(
`
<el-select v-model="value" value-key="id">
<el-option
v-for="item in options"
:key="item.id"
:label="item.label"
:value="item"
/>
</el-select>
`,
() => ({
options: [
{ id: 1, label: 'Option A', desc: 'Option A - 230506' },
{ id: 2, label: 'Option B', desc: 'Option B - 230506' },
{ id: 3, label: 'Option C', desc: 'Option C - 230506' },
{ id: 4, label: 'Option A', desc: 'Option A - 230507' },
],
value: { id: 3 },
})
)
await nextTick()
const options = getOptions()
expect(wrapper.find(`.${PLACEHOLDER_CLASS_NAME}`).text()).toBe('Option C')
expect(Array.from(options[2].classList)).toContain('is-selected')
})
test('sync set value and options', async () => {
wrapper = _mount(
`

View File

@ -11,10 +11,10 @@ export function useOption(props, states) {
// computed
const itemSelected = computed(() => {
if (!select.props.multiple) {
return isEqual(props.value, select.props.modelValue)
} else {
if (select.props.multiple) {
return contains(select.props.modelValue as unknown[], props.value)
} else {
return contains([select.props.modelValue] as unknown[], props.value)
}
})