Element-UI表格点击Popover 弹出框确定取消

 

 

 

 

 

 <el-table-column width="600">
          <template slot-scope="scope">
<el-popover trigger="click" placement="top" width="450" @show="handleStatus(scope)" :ref="`popover-${scope.$index}`">
              <div>
                  <el-input type="textarea" :rows="5" maxlength="300" placeholder="请输入内容" v-model="scope.row.spaceAllocatePrice"></el-input>
              </div>
              <div style="text-align: left; margin-top: 20px">
                <el-button size="small" plain @click="cancelClick(scope)">取消</el-button>
                <el-button type="primary" size="small" @click="sureClick(scope)">确定</el-button>
              </div>
              <el-button slot="reference" type="text">说明</el-button>
            </el-popover>
          </template>
        </el-table-column>

 

 

cancelClick(scope){ 
      this.$message('点击了取消操作'); 
      scope._self.$refs[`popover-${scope.$index}`].doClose() 
    },
    sureClick(scope){
      // 可以在这里执行删除数据的回调操作.......删除操作......
      this.$message({
        message:"点击了确定操作了",type: 'success'
      });
      scope._self.$refs[`popover-${scope.$index}`].doClose()
    },