el-cascader选中节点之后,清空选中的选项

项目需要选中城市后,添加至已选城市列表,选项框换成“+新增城市”字样,所以需要禁止将选中的值显示在选中框

 <el-cascader
                class="serve_citySel"
              popper-class="serve_suspend"
              placeholder="+ 新增服务区"
              v-model="cityName"
              :options="provinceDataArr"
              :props="serCitProp"
              @change="addServiceArea"
              @visible-change="handleCity"
              ref="getSerCitySelName"
              :key="isResouceShow"
            ></el-cascader>
         
    // 清空选中的城市,只显示“新增服务区”,记得在beforeUpdate生命周期给数据源重新赋值
    methods: {
    addServiceArea(){
          this.cityName = ''  // 清空双向绑定的选中值
          ++this.isResouceShow // 让key自增,防止报错
          this.provinceDataArr =[]  // 清空数据源
    }
}
   beforeUpdate(){
      this.provinceDataArr = data   // 城市数据需要重新赋值
    }

 

posted @ 2021-01-05 20:47  陈年风褛1874  阅读(2369)  评论(0)    收藏  举报