Vue.js项目中如何为PrimeVue Dropdown组件设置预选中值？

PrimeVue Dropdown 不需要单独的预选中属性，直接通过其绑定的v-model即可实现预选中效果，根据你绑定值的类型不同，有两种实现方案：

方案1：绑定选中项的完整对象（你当前代码的默认情况） #

你当前没有配置optionValue属性，Dropdown默认会把选中的完整对象绑定到v-model变量上，预选中时只需要在组件初始化阶段（created/onMounted生命周期），从filterPositions数组中取出你要默认选中的对象，赋值给selectedFilter[index].pos即可：

// 示例：预选中value为2的选项
this.selectedFilter[index].pos = this.filterPositions.find(item => item.value === '2')

注意：必须直接使用filterPositions数组中的对象引用，不能自行新建结构相同的对象赋值，否则Dropdown会因为引用地址不同识别为非匹配项，无法触发预选中。

方案2：绑定选中项的value属性（更推荐，避免引用问题） #

如果不需要存储完整对象，只需要存选中项的value值，可以给Dropdown组件增加optionValue="value"属性，指定绑定值为选项对象的value字段：

<template #position>
    <Dropdown
        class="multiselect-fullsize"
        v-model="selectedFilter[index].pos"
        :options="filterPositions"
        optionLabel="name"
        optionValue="value"
        placeholder="Position" />
</template>

预选中时直接给v-model绑定变量赋值对应的value值即可：

// 示例：预选中value为5的选项
this.selectedFilter[index].pos = '5'

内容的提问来源于stack exchange，提问作者StevenSiebert