q-select 下拉框单选
时间: 2023-07-23 19:06:08 浏览: 179
要将 Quasar 的 q-select 下拉框设置为单选模式,你可以使用 `v-model` 指令来绑定选中的值,并将 `multiple` 属性设置为 `false`。
以下是一个示例,演示如何将 q-select 设置为单选模式:
```html
<template>
<div>
<q-select v-model="selectedItem" :options="items" label="Select an item" dense outlined />
</div>
</template>
<script>
export default {
data() {
return {
selectedItem: null,
items: [
{ label: 'Item 1', value: 'item1' },
{ label: 'Item 2', value: 'item2' },
{ label: 'Item 3', value: 'item3' },
{ label: 'Item 4', value: 'item4' },
]
};
}
};
</script>
```
在上面的示例中,我们使用 `v-model` 将 `selectedItem` 绑定到 q-select。`selectedItem` 将保存用户选择的项目值。通过将 `multiple` 属性设置为 `false`,我们确保 q-select 是单选模式。
你可以根据自己的需求修改选项的标签和值。
阅读全文