关于vue.js:vueelement中switch使用二

vue+element中switch应用二

1.开发环境 vue+element
2.电脑系统 windows 10 专业版
(//留神:本次只是为了作者本人不便今后翻阅,记录的文章,写的不好,请勿喷!)
3.在开发的过程中,咱们总是会应用到 vue+element进行开发,通常会应用到 element的switch 开关!具体如下:
效果图:

3-1:点击批改 按钮 ,成果如下:

通过批改 无效的开关,决定是否显示对应的状态!
//通过上图可知,id为5的数据此时是关上的状态,点击批改进行批改对应的状态并实现自动更新对应的状态,不须要手动刷新!代码如下:

3-2:在 methods中增加如下代码:

bianhua(){
        var _this=this;
        var ee={
          id:_this.chenxgid,
          code:_this.bianhao,
          name:_this.mingcheng,
          isSign:_this.show0
        }
        Cxiugai(ee).then(res=>{
          console.log(res);
          if (_this.ChenCode=="0"){
            this.$message('批改胜利啦');
            _this.open=false;
            _this.jiazai();
          }else {
            this.$message('批改失败啦');
          }
        })
      },

// this.ChenCode 是在 return 上面定义的:

3-3:在methods中增加批改的办法的代码:

//点击批改
      xiugai(  rows){
        var _this=this;
        console.log(rows)
        console.log("我是批改------------------------");
        // console.log(rows[index]);
        // _this.bianhao=rows[index].code;
        // _this.mingcheng=rows[index].name;
        // // _this.handleAdd();
        // _this.handleEdit();

        this.open = true;
        this.title = "批改";

        console.log(rows);
        console.log("我是对应的id");
        console.log(rows.id);
        _this.chenxgid=rows.id;
        var dd={
          id:rows.id,
          code:_this.bianhao,
          name:_this.mingcheng,
          isSign:_this.show0
        }

        chenxiugai(dd).then(res=>{
          console.log("传完id之后,后盾返回对应的数据");
          console.log(res);
          _this.ChenCode=res.code;
          if (res.id!=""){
            //如果 id不为空,示意有数据,
            // _this.handleEdit();

          //  把后盾的数据渲染到表单下面
            _this.hqxg=res.data;
            _this.bianhao=_this.hqxg.code;
            _this.mingcheng=_this.hqxg.name;

          //存一下 状态 code 判断是否批改胜利啦


          }
        })
      },

4.—留神:本文章只是作者不便今后应用,本人写的一个笔记,写的不好请勿喷!谢谢了解!