问题场景：

前端常见场景，在表格中嵌套操作按钮，点击弹出对话框dialog，在dialog上有操作提示或者内容提交。

注：此处使用element-ui

image

做法：

 <el-table-column>
        <template slot-scope="scope">
              <el-button v-if="scope.row.roomStatus === '0'" slot="reference" class="button" type="danger" size="small" @click="operateDialog(scope.row)">点击下线</el-button>
              <el-button v-else slot="reference" class="button" type="primary" size="small" @click="operateDialog(scope.row)">点击上线</el-button>
              <el-button class="button" type="info" size="small" @click="handleClickDialog(scope.row.roomId)">操作记录</el-button>
              <el-dialog
                :title="dialogTitle"
                :visible.sync="dialogVisible"
                width="30%"
              >
                <span>请输入操作原因: </span><br>
                <el-input
                  v-model="dialogTextarea"
                  type="textarea"
                  maxlength="100"
                  show-word-limit
                  :autosize="{ minRows: 3 }"
                />
                <span slot="footer" class="dialog-footer">
                  <el-button class="button" @click="dialogVisible = false">取消</el-button>
                  <el-button class="button" type="primary" @click="operateConfirm(scope.row)">提交</el-button>
                </span>
              </el-dialog>
            </template>
</el-table-column>

以上代码中，在每个行标签<el-table-column>中，嵌套按钮，同时点击按钮，弹出对话框el-dialog，并且使用slot-scope="scope"来向组件传递当前行内容。
实测，嵌套dialog时，如果dialog内部又有子元素需要取到当前行内容，scope取值会发生错误，取到当前渲染页面的最后一行内容

原因分析

可能是同时渲染了所有行的dialog，产生了重叠，实际取最后一个（索引值最大）的行内容。
但是，上面第一级嵌套元素button，可以取到正确值。

解决方式

暂时没有找到element层面的解决方法。
我用了比较笨的方法，设置全局变量selectRoom，在第一级嵌套的时候的函数中，修改这个全局变量值，在dialog二级嵌套中，直接使用这个全局变量。

    operateConfirm() {
      // 全局变量
      console.log('selectRoom', this.selectRoom)
      if (this.selectRoom.roomStatus === '0') {
        this.offlineRoom(this.selectRoom)
      } else if (this.selectRoom.roomStatus === '1' || this.selectRoom.roomStatus === '2') {
        this.onlineRoom(this.selectRoom)
      }
      this.dialogVisible = false
    },

以上内容若有误，请各位指出，避免误导更多人。