vue移动端弹窗

1.触发弹窗事件  参考VUE官网 https://doc.vux.li/zh-CN/components/confirm.html

 <button  @click="goReserveDispose()">点击弹窗</button> 

 goReserveDispose(){
      this.show5 =true; //弹窗设置true
  },

引用的组件

import { Datetime , Group , Checklist , XButton, Scroller,XInput ,Confirm, TransferDomDirective as TransferDom,Radio} from 'vux'
  directives: {TransferDom },
  components: {  Datetime,Group,Checklist , XButton , topSelectBar , Scroller,XInput,Confirm,Radio},

div代码

  <!--分配弹窗-->
    <div v-transfer-dom >
      <confirm v-model="show5"
      @on-confirm="onConfirm5" >
        <div >
          <div style="display:inline-block">
            <group >
              <x-input class="ssk"  style="float:left;margin:10px;border: 2px solid #99dfcc;border-radius:10px;width:200px;color:Black;height:35px;box-shadow:10px;background:#f2f6fc"  v-model="employeeName">
                <img  @click="changedDate" slot="label" style="padding-right:2px;display:block;" src="../../assets/images/sousuo1.png" width="20" height="20  ">
              </x-input>
            </group>  
          </div>
         
        </div>  
        <group style="overflow:scroll;height:200px">
          <radio v-model="checkedValue"  :options="radio003" ></radio>
        </group>
      </confirm>
    </div>

radio003弹窗数据

 radio003: [{
        icon: 'https://dss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=3523376988,1285761647&fm=26&gp=0.jpg',
        key: '001',
        value: '王军'
      }, {
        icon: 'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3302399998,3216746631&fm=26&gp=0.jpg',
        key: '002',
        value: '不帮'
      },{
        icon: 'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3302399998,3216746631&fm=26&gp=0.jpg',
        key: '003',
        value: '卡卡'
      },{
        icon: 'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3302399998,3216746631&fm=26&gp=0.jpg',
        key: '004',
        value: '陈老师'
      },{
        icon: 'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3302399998,3216746631&fm=26&gp=0.jpg',
        key: '005',
        value: '二月'
      },{
        icon: 'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3302399998,3216746631&fm=26&gp=0.jpg',
        key: '006',
        value: '林俊杰'
      },{
        icon: 'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3302399998,3216746631&fm=26&gp=0.jpg',
        key: '003',
        value: '卡卡'
      },{
        icon: 'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3302399998,3216746631&fm=26&gp=0.jpg',
        key: '004',
        value: '陈老师'
      },{
        icon: 'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3302399998,3216746631&fm=26&gp=0.jpg',
        key: '005',
        value: '二月'
      },],

获取选中结果

    onConfirm5 (value) { //获取弹窗选择
      //alert(this.checkedValue);
      //alert(this.workOrderId)
      //this.$refs.confirm5.setInputValue('')
      //this.$vux.toast.text('input value: ' + value)
    },

效果图