sf-icon-select 图标选择器
sf-icon-select 介绍
1.该组件可以自动从src/icons/svg中读取所有的图标并显示在下拉选项中
2.可通过点击选择需要的图标
3.可通过在输入框输入图标名匹配对应的图标，然后进行选择
sf-icon-select Attributes
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| value/v-model | 绑定值 | [String, Number] | — | — |
| width | 规定弹出框宽度 | String | — | — |
| placeholder | 占位符 | String | — | — |
| disabled | 禁用 | Boolean | — | — |
sf-icon-select Methods
| 方法名 | 说明 | 参数 |
|---|---|---|
| selectedIcon | 为弹出框中显示的每一个图标绑定一个点击事件，触发后自动将图标名放到input输入框中 | — |
sf-icon-select 使用
<template>
<div>
<sf-icon-select
v-model="icon"
>
</sf-icon-select>
</div>
</template>
<script>
export default {
data() {
return {
icon: ''
}
},
methods: {
}
}
</script>
页面初始显示效果
点击输入框时的效果
选择图标后的效果
