v-if条件判断成立却不显示

Question

这种情况下，为什么两个按钮直接都不显示了，按理来说，初始化会显示第一个按钮啊

<el-table-column label="操作">
          <template slot-scope="scope">
            <el-button v-if="outExamBoolean===true" @click="toExaming(scope.row.examId)" type="success">开始考试</el-button>
            <el-button v-if="outExamBoolean && examId===scope.row.examId" @click="toExaming(scope.row.examId)" type="warning">继续考试</el-button>
          </template>

        </el-table-column>


export default {

  name: "index",
  data() {
    return {
      //考试科目
      tableData: {
        examId:"",
        examName:"",
        examScore:"",
        examTime:"",
        createTime:"",
        deadlineTime:""
      },
      //Boolean
      outExamBoolean:true,
      examId:""
    }
  }
}

Answer 1

参考GPT和自己的思路：

根据你提供的代码，初始化时outExamBoolean的值为true，因此第一个按钮应该会显示出来，但第二个按钮应该是不会显示的，因为examId的值未定义，无法满足条件examId===scope.row.examId。请检查examId的赋值是否正确，如果examId的值未定义，则可以通过在data里赋一个默认值来避免这种情况。另外，建议在浏览器开发者工具中检查控制台是否有任何错误信息，以帮助识别该显示问题的根本原因。