el-select的change事件显示v-model对应的值已经变了，但是web界面上却并没有变化？

Question

electron+elementui+vue.js环境：

<el-select v-model="monitorList[0].resolutionValue" placeholder="请选择" @change='changeResolution'>
  <el-option v-for="item in monitorList[0].modes" :key="item.width+'x'+item.height" :label="item.width+'x'+item.height" :value="item.width+'x'+item.height">
  </el-option>
</el-select>

    changeResolution() {
      console.log("changeResolution")
      console.log("this.monitorList[0].resolutionValue:",this.monitorList[0].resolutionValue)
      return true
    },

用鼠标把下拉框el-select中的1440x900改为1920x1080，这里的console.log打印出this.monitorList[0].resolutionValue已经变成了1920x1080，但是界面上还是显示为1440x900，请问这是哪里没写对？

Answer 1

据说要自己改，写成这样：
@change="$set(monitorList[0], resolutionValue, $event)"
但是却报错resolutionValue属性未定义

Answer 2

测试了下 正常 不存在你说的问题
https://jsfiddle.net/6ov4zumh/

Answer 3

vue对象赋值的时候如果要响应式的，@change="$set(monitorList[0], 'resolutionValue', $event)"如一楼说的

Answer 4

monitorList[0]上面没有预定义resolutionValue属性