解决使用行内el-input修改值时视图没有更新得问题

<template>
  <div class="ele-body">
      <el-table
        :data="list"
        :span-method="objectSpanMethod"
        border
        style="width: 100%; margin-top: 20px"
      >
        <el-table-column label="小类/价格" align="center">
          <template slot-scope="scope">
            <div
              v-for="item in scope.row.sub"
              :key="item.id"
              style="display:flex;align-items: center;"
            >
              {{ item.name }}
     //用el-input就不能做响应式，所以用了input然后再把el-input的css样式copy了
              <input
                class="input__inner"
                style="width: 150px;margin:5px auto"
                placeholder="请输入价格"
                v-model="item.price"
              />
            </div>
          </template>
        </el-table-column>
      </el-table>
  </div>
</template>

<script>
 
   this.$set(this.list, index, item);//填自己的值
   //对应：要更改的数据源(可以是对象或者数组) 要更改的具体数据  重新赋的值
</script>
<style scoped>

.input__inner {
  -webkit-appearance: none;
  background-color: var(--input-background-color);
  background-image: none;
  border-radius: 4px;
  border: 1px solid var(--border-color-base);
  box-sizing: border-box;
  color: var(--color-text-regular);
  display: inline-block;
  font-size: inherit;
  height: 40px;
  line-height: 40px;
  outline: none;
  padding: 0 15px;
  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  width: 100%;
}
</style>