更新记录
1.0.8(2025-04-14) 下载此版本
1.新增选中触发change方法 2.代码优化
1.0.7(2025-03-03) 下载此版本
修复异步数据无法回显问题 优化调整部分逻辑
1.0.6(2025-02-18) 下载此版本
修复设置默认值不回显bug
查看更多平台兼容性
uni-app
Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 |
---|---|---|---|---|---|---|---|---|
√ | √ | √ | √ | - | - | - | - | - |
微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 快应用-华为 | 快应用-联盟 |
---|---|---|---|---|---|---|---|---|---|---|
√ | - | - | - | √ | - | - | √ | √ | - | - |
其他
多语言 | 暗黑模式 | 宽屏模式 |
---|---|---|
× | × | √ |
基本使用
单选使用
<yh-select :data="list" v-model="selectVal1"></yh-select>
多选使用
<yh-select :data="list" multiple v-model="selectVal2"></yh-select>
<script>
import yhSelect from "./components/yh-select/yh-select.vue"
export default {
components:{yhSelect},
data(){
return {
selectVal1:"",
selectVal2:[],
list:[
{
label:'选项1',
value:1
},
{
label:'选项2',
value:2
},
{
label:'选项3',
value:3
}
]
}
},
}
</script>
参数说明
search:{//是否开启搜索
type:Boolean,
default:false
},
multiple:{
type:Boolean,//是否为多选
default:false
},
height:{
type:Number,//选择框高度
default:60
},
top:{
type:Number,//下拉框距离选择框距离
default:70
},
borderRadius:{
type:Number,//选择框圆角
default:8
},
borderColor:{
type:String,//选择框border颜色
default:'#dcdfe6'
},
placeHolder:{
type:String,//占位提示
default:'请选择'
},
disabled:{
type:Boolean,//是否禁用
default:false
},
clearble:{
type:Boolean,//是否可以清空选中
default:false
},
format:{
type:Object,//格式化
default:()=>{
return {
label:"label",
value:"value"
}
}
}
@change event 选中触发回调