-
Notifications
You must be signed in to change notification settings - Fork 498
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. Weβll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix(SelectMenu): use by
prop to compare objects for selected values
#2228
base: dev
Are you sure you want to change the base?
Conversation
@@ -481,7 +490,7 @@ export default defineComponent({ | |||
} | |||
|
|||
return props.options || [] | |||
}, [], { | |||
}, props.options || [], { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@benjamincanac Since the selected
computed proeprty uses the computedAsync
options
Β to get the possible values, I initialized it to props.options
Β so that it isn't empty during the initial render of the component to prevent a flash.
However, now that I'm thinking about it, shouldn't we just use props.options
directly in the selected
Β computed, instead of options
- since we don't want to compare the model values with only the search results, but rather the whole options?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I also added the possibility to compare nested objects using the Consider the following example: <template>
<USelectMenu
v-model="selected"
:options="options"
multiple
value-attribute="object"
by="id"
/>
</template>
<script lang="ts" setup>
const selected = ref([{
id: 1,
title: 'Hello'
}])
const options = [
{
key: 'id',
label: 'ID',
object: {
id: 1,
title: 'Hello'
}
},
{
key: 'title',
label: 'Title',
object: {
id: 2,
title: 'Hi'
}
},
{
key: 'status',
label: 'Status',
object: {
id: 3,
title: 'Hey'
}
}
]
</script> Previously (even before the introduction of the |
π Linked issue
fixes #2028
β Type of change
π Description
This PR fixes a bug introduced in #1349, where the
by
prop was not being consiederd when computing the selected values.It also adds the possibility to combine the
by
prop with thevalue-attribute
prop to compare nested objects like in the following example:π Checklist