v-model:selectedKeys
时间: 2024-08-21 07:00:41 浏览: 38
wx-tree:微信小程序中的树形结构
`v-model:selectedKeys` 是 Vue.js 中的一个特性,它用于双向绑定一个数组,通常与 `v-select`(选择框)配合使用,来表示选中的选项的 key 值。当你在下拉菜单中选择一个项时,对应的 key 值会被添加到这个数组中;反之,如果从数组中移除某个 key,则相应的选中项也会被清除。
这是一个简单的例子:
```html
<template>
<select v-model="selectedKeys">
<option v-for="(item, index) in options" :key="index" :value="item.key">
{{ item.label }}
</option>
</select>
</template>
<script>
export default {
data() {
return {
selectedKeys: [], // 初始化为空数组
options: [
{ key: '1', label: 'Option 1' },
{ key: '2', label: 'Option 2' },
{ key: '3', label: 'Option 3' }
]
};
}
};
</script>
```
在这个例子中,当你在下拉菜单中选择 "Option 1",`selectedKeys` 数组就会变成 `['1']`。如果选择 "Option 3",`selectedKeys` 变为 `['3']`,并移除之前的选择。
阅读全文