Tom*_*Tom 4 javascript combobox vue.js vuetify.js
我正在使用VuetifyJS的组合框组件,我需要在下拉列表中的每个条目前添加一个图标。怎么做?这是组合框的 CodePen 示例:https://codepen.io/anon/pen/KBLXYO
HTML
<div id="app">
<v-app id="inspire">
<v-container fluid>
<v-layout wrap>
<v-flex xs12>
<v-combobox
v-model="select"
:items="items"
label="Select a favorite activity or create a new one"
></v-combobox>
</v-flex>
</v-layout>
</v-container>
</v-app>
</div>
Run Code Online (Sandbox Code Playgroud)
JS:
new Vue({
el: '#app',
data () {
return {
select: 'Programming',
items: [
'Programming',
'Design',
'Vue',
'Vuetify'
]
}
}
})
Run Code Online (Sandbox Code Playgroud)
使用item作用域插槽。
<v-combobox
v-model="select"
:items="items"
label="Select a favorite activity or create a new one">
<template slot="item" slot-scope="data">
<v-icon>home</v-icon> {{data.item}}
</template>
</v-combobox>
Run Code Online (Sandbox Code Playgroud)
这是您的笔更新。
FWIW,这都包含在文档中。
| 归档时间: |
|
| 查看次数: |
4100 次 |
| 最近记录: |