vue 监控el-switch控件值的变化

我要的效果是根据系统消息的推送范围决定推送人标签的显示,如下图两种情况:
——选择全站推送
vue 监控el-switch控件值的变化_第1张图片——选择个人推送

vue 监控el-switch控件值的变化_第2张图片
——页面定义的data对象
vue 监控el-switch控件值的变化_第3张图片

  1. el-switch标签控件的代码, v-model="entity.pushRange"绑定的是推送范围字段
  
       
       
  

下面的推送人id文本框,v-if=“FalgpushId”用来控制该文本框的显示,等于false时隐藏,true时显示(默认值为初始化时定义的FalgpushId = false,所以隐藏掉了)

  
  
      
  
  1. methods中的方法,通过$event写法来监控该控件值的变化
  methods:{
  
		  //该方法传入推送范围值,根据判断,决定是否展示其下面的推送人ID文本框
          parens2(value){
            let self = this ;
            if(value == false){
              //el-switch控件为 个人推送时,value为false
              self.FalgpushId = true;     //推送人id文本框显示    
              self.entity.pushRange = false;  
            }else if(value == true){
              //el-switch控件为 true 全站推送,value为true
              self.FalgpushId = false;     //推送人id文本框隐藏
              self.entity.pushRange = true;
            }
          },

  }

你可能感兴趣的:(前端)