Select 选择器显示内容为icon图标选项(Ant Design of Vue)
<template><div><a-select size="large" placeholder="请选择图标" style="width: 200px" @change="handleChange"><a-select-optionv-for="i in seleiconlist":key="i.key"><a-icon :type="i.
·
<template>
<div>
<a-select size="large" placeholder="请选择图标" style="width: 200px" @change="handleChange">
<a-select-option
v-for="i in seleiconlist"
:key="i.key"
><a-icon :type="i.value" style="font-size: 18px;"/></a-select-option>
</a-select>
</div>
</template>
<script>
export default {
data() {
return {
seleiconlist:[
{key:"account-book",value:"account-book"},
{key:"appstore",value:"appstore"},
{key:"bank",value:"bank"},
{key:"book",value:"book"},
{key:"clock-circle",value:"clock-circle"},
{key:"snippets",value:"snippets"}
]
};
},
mounted() {},
methods: {
handleChange(value) {
console.log(`Selected: ${value}`);
},
}
};
</script>
<style scoped>
</style>
更多推荐
已为社区贡献8条内容
所有评论(0)