Vue.js - 개체 속성 업데이트 후 dom 업데이트

Question

이것은 나를 미치게합니다. v-model이있는 Dom은 개체 속성으로 업데이트되지 않지만 Vue devtools는 올바르게 업데이트됩니다.

어딘가에서 Vue.$set이 필요하다는 것을 알았습니다. v-for 반복에서 불가능 해 보입니다.

<el-tab-pane v-for="(item, index) in onShelveForm.data" :key="item.id" :label="item.name"> 
    <div class="form-block" v-for="formItem in formStructure"> 
    <el-form-item 
    :prop="'data.' + index + '.' + formItem.id" 
    :label="formItem.name"> 

     <el-select 
     v-model="item[formItem.id]" 
     readonly="false"> 
     <el-option v-for="option in formItem.value.regex" 
      :label="option" 
      :value="option"></el-option> 
     </el-select> 

    ... 

옵션을 클릭하면 선택기가 새 값을 표시하지 않지만 Vue devtool이 올바르게 반응합니다.

Vue.$set으로 저장할 수 있다면 v-for에서 어떻게 사용합니까?

Answer 1

당신이 jsfiddle을 제공 할 수있는 경우 v-model가

같은 인스턴스를 만들 때 개체가 존재하지 몇 가지 가능성이있다가 작동하지 않는 이유는 쉽게 볼 수 있습니다.

가장 간단한 방법은 @change='Vue.$foceUpdate()'을 추가하여 변경이 발생하면 업데이트를 강제로 수행하는 것일 수 있습니다. v-model이 작동해야합니다.

<el-select 
    @change='Vue.$foceUpdate()' 
    v-model="item[formItem.id]" 
    readonly="false"> 
    <el-option v-for="option in formItem.value.regex" 
     :label="option" 
     :value="option"></el-option> 
</el-select>