首页 课程 师资 教程 报名

Vue点击按钮弹出页面

  • 2021-09-02 10:56:52
  • 1553次 星辉

先在data里面定义变量

visible:false,
id:''

来个a标签

<a @click="inpect(record)">核查</a>

methods中的方法

      inspect(record){
        this.visible = true;
        this.id = record.id;
      },

给个model

    <a-modal title="数据核查" v-model="visible" @ok="handleOk2()">
      <a-row :gutter="20">
        <a-col :span="18">
          <a-form-item label="核查状态">
            <j-dict-select-tag type="list" v-model="zhuang" style="width: 100%;" dictCode="verification_status" placeholder="请选择核查砖头"/>
          </a-form-item>
        </a-col>
      </a-row>
      <a-row :gutter="20">
        <a-col :span="18">
          <a-form-item label="上传证明材料">
            <j-upload v-model="materials" :trigger-change="true"></j-upload>
          </a-form-item>
        </a-col>
      </a-row>

    </a-modal>

好了,接着就是handleOk2方法了,后台根据id更新这条数据

      handleOk2(){
        var aaa = this.zhuang;
        var bbb = this.materials;
        var id = this.theid;
        this.axios.get('/basicdataverification/basicDataVerification/verification', { params: { 'id': id,'status': aaa,'materials':bbb } }).then((response)=>{
          console.log("返回的结果",response)
        })
        this.visible = false;
      },

以上就是星辉小编介绍的"Vue点击按钮弹出页面",希望对大家有帮助,想了解更多可查看编程入门教程。星辉星辉在线学习教程,针对没有任何Java基础的读者学习,让你从入门到精通,主要介绍了一些Java基础的核心知识,让同学们更好更方便的学习和了解Java编程,感兴趣的同学可以关注一下。

选你想看

你适合学Java吗?4大专业测评方法

代码逻辑 吸收能力 技术学习能力 综合素质

先测评确定适合在学习

在线申请免费测试名额
价值1998元实验班免费学
姓名
手机
提交