最近公司的老项目需要在某个搜索页增加一条搜索条件使用到了mt-picker,同时也发现了一些问题
页面中有个表单重置的按钮,来清除所有选项,但是在清除后,再次打开mt-picker,选项值依然是之前的选项,没有恢复到第一个选项,由于之前没有用过mint,所以这里记录一下解决办法
解决办法
不要将上面的change事件误解为 只有在@change事件中调用,可以在弹出mt-picker的触发函数中通过this.refs.example.setSlotValue(index, value)设置当前选项
注意
data () {
return () {
slot: [
{
flex:1,
values: [
{key:'1',value:'test'}
]
}
]
}
}
setSlotValue(index, value)中的index不是slot中values中值的下标,而是slot的下标,而value则是slot中values中的值
例如:
// 将mt-picker选项设置为第一个
// 在mt-picker组件设置ref = 'test'
this.$refs.test.setSlotValue(0, this.slot[0].values[0])
最后
文档写的过于简单,如果单凭文档遇到点问题无从下手,也没有例子,参数如何填写也没有描述,只能自己闷头解决,正如issues某位老哥说的
公司项目移动端在某个搜索页面用到了多个mt-picker及mt-datetime-picker,由于是老项目,所以使用的是Mint-ui,目前前端开发人员不多,暂时也没有安排重构的任务,所以还是选择继续使用,保持代码一致,然而,Mint-ui已经停止维护5年(截至2022/10/11)了,官网也报错打不开了,已使用的尽早脱坑吧,未使用的也不要入坑了。