Vue.js - 对象属性更新

问题描述:

这让我发疯后更新DOM。大教堂与v-model不会与对象的属性更新,但Vue公司devtools正确地做更新。Vue.js - 对象属性更新

我来自的地方,这可能需要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

+1

你能提供一个jsfiddle请愿书。另外如果'el-select'是你自定义的'select'元素 - 它不会处理'v-model'。 – euvl

+0

它可以处理'v型model'如果他将提供它 –

,如果你能提供的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>