如何在 vuetify 中正确使用 select？

Question

我目前使用vuetify，到目前为止，下面的代码正在运行<v-select>。

<v-select
    :items="order_by_opt"
    v-model="order_column"
    label="Order By"
    outlined
></v-select>

//script
data() {
    order_by_opt: ["Last Added", "Name", "Year Joined", "Age", "Date of Birth", ..etc.],
    order_column: ''
}

我只是想问一下如何将下面的html代码翻译成v-select

<select>
    <option value="last_added">Last Added</option>
    <option value="name">Name</option>
    //more options here
</select>

其中标签和值不同，例如下面。如果我选择上次添加，那么我应该得到值last_added？

Answer 1

您可以通过提供对象数组来做到这一点，例如文档中的this example。 props 定义了哪个选项属性代表选择的值，哪个是显示值。