美文网首页vue
vue 父组件 监听子组件 事件 (强制刷新子组件的)

vue 父组件 监听子组件 事件 (强制刷新子组件的)

作者: 凌晨丶杨先森灬 | 来源:发表于2019-10-11 15:42 被阅读0次

    子组件改变父组件传递的 参数 不刷新

    ① 子组件上 添加 v-if

    ② 父组件 监听数据

    this.reFresh= false  
     this.$nextTick(()=>{
     this.reFresh = true 
       })
    

    具体实现

    子组件

    <template>
          <a-input>
            <a-icon @mousedown="cleanClick"/>
            <span slot="suffix" v-show="!cleanInputType"> 分</span>
          </a-input>
     </template>
    
    cleanClick() {
      
      // 判断如果是关联小题 那么就开始让他的题型状态为false
    
      if (this.scoreParam.structureType) {
    
        this.scoreParam.multipleFlag = false;
        this.scoreParam.fillBlankFlag = false;
      }
      this.$emit('my-reFresh', this.scoreParam);
    },
    

    父组件

    <to-score-templeate
      v-if="reFresh"
      @my-reFresh="myReFresh"
     ></to-score-templeate>
    
    myReFresh(msg){
      this.reFresh= false
      this.$nextTick(()=>{
        this.reFresh = true
      })
      console.log('接收的数据--------->'+msg)//接收的数据--------->我是子组件中的数据
    }
    

    相关文章

      网友评论

        本文标题:vue 父组件 监听子组件 事件 (强制刷新子组件的)

        本文链接:https://www.haomeiwen.com/subject/djtxmctx.html