提示下拉列表 (vue-dropdowns)
A prettier way to display select boxes if you're selecting objects if you're using a v-for on objects.
如果在对象上使用v-for,则在选择对象时显示选择框的更漂亮的方式。
No special dependencies, no jquery, no bootstrap, just VueJS and CSS goodness.
没有特殊的依赖关系,没有jquery,没有引导程序,只有VueJS和CSS优点。
要求 (Requirements)
Vue.js ^2.0.0
Vue.js ^ 2.0.0
安装 (Installation)
$ npm install vue-dropdowns
// OR
$ yarn add vue-dropdowns
用法 (Usage)
<dropdown :options="arrayOfObjects" :selected="object" v-on:updateOption="methodToRunOnSelect"></dropdown>
<script>
import dropdown from 'vue-dropdowns';
export default {
data() {
return {
arrayOfObjects: [],
object: {
name: 'Object Name',
}
}
},
components: {
'dropdown': dropdown,
},
methods: {
methodToRunOnSelect(payload) {
this.object = payload;
}
}
}
</script>
去做 (Todo)
Add different styles to choose from
添加不同的样式以供选择
Add option to include own styling via json object
添加选项以通过json对象包括自己的样式
翻译自: https://vuejsexamples.com/a-prettier-way-to-display-select-boxes/