封装van-popup为自己的弹窗组件解决v-moel props单向数据流不能修改的问题。

今天需要把项目的van-popup组件封装成自己的组件可随处调用，因为<van-popup v-model="show">内容</van-popup> 通过show的双向数据绑定控制 开关 一开始想通过$emit回传回去但发现并不是想象中那样 后来多亏vant群帮助解决了该问题 感谢

父组件调用子组件

<text-consult v-model="showPostDialog"></text-consult>

子组件

<template>
  <div>
    <van-popup :value="value" @input="val=>this.$emit('input',val)" closeable :style="{ height: '5.5rem',width:'5rem' }" class="mypop" >
        <div class="box">
          <img :src="qrcode" alt="">
          <p>{{saler_qrcode_content}}</p>
        </div>
      </van-popup>
  </div>
</template>

export default {

  name:'TextConsult',

  props:{

    value:Boolean

  },

 

 以上。