vant picker 移动端点击d窗--进行选择

移动端点击d窗–进行选择picker(vant)
这里可以有偿帮你直接解决bug，我的微信号18062748486；如加微信，请备注“Bug 解决”

实现此效果 ，是两个插件的组合使用：

import Vue from ‘vue’;

import { Popup } from ‘vant’;

import { Picker } from ‘vant’; Vue.use(Picker);

Vue.use(Popup);

搭配d出层使用 Popup & picker

//对应的方法 onConfirm(value, index) { this.surePickItem = value; /*value 为 选择数组 columns 的其中一个对象 {"keyId":1,"text":"机光安装"}*/ if (value.keyId == 1){ Toast(`${value.text }`); } this.popShow = false ; }, onChange(picker, value, index) { Toast(`当前选择 : ${value.text }`); },

getEquipmentMouldIndex(){
api.getEquipmentMouldIndex({
orderId:this.orderId,

})
.then((res) => {

  if (res.code == 200) {
    this.chooseItems = res.data.mouldItems ;   /*从接口中获取的数组，需要封装成 picker 里面可以显示的数组*/
    /*文档中columns 是columns: ['杭州', '宁波', '温州', '嘉兴', '湖州'], 但是实际中需要封装的里面是对象;这里
    * columns 的里面对象的key 是固定的 text & keyId  其中至少有一个是text 否则将不会显示出来；
    * */
    for (var i = 0;i< this.chooseItems.length ;i++){
      var obj = {};
      obj.text = this.chooseItems[i].itemIndex + " " + this.chooseItems[i].mouldItem ;
      obj.keyId = this.chooseItems[i].itemIndex;
      this.columns.push(obj)
    }
  } else {

    this.$message({
      message: res.message,
      icon: 'error',
      timeout: 1500,
    });
  }
});

},
/进行非空的判单/

if (JSON.stringify(this.surePickItem ) == “{}”){
Toast.fail(‘请点击选择步骤’);
return

}
// 在div 中赋值则可以这样：

以上步骤未选择 {{surePickItem.text}}

遇到Bug欢迎交流。