Question

实际上，这是我在使用API的真实项目中遇到的问题。我先解释一下，我使用axios来调用api数据。这将得到json数组，每个数组都有相同的无线电值，所以我将无线电值附加到每个数组。虽然我想通过v-model更改无线电值，但它无效。我在radio元素下输出selected值。下面我展示了我的项目代码。

＆＃13;

var app2 = new Vue({
  el: '#app-2',
  data: {
    list: null
  },
  created: function () {
    var json = [{id:1,name:"B"},{id:2,name:"D"}]
    this.list = json
    this.list.forEach(function (v) {
       v.options = [{ text: 'pacageA' , value: 1},{text: 'pagckaeB',value:2}]
       v.selected = null
    })
  }
})

＆＃13;

<script src="https://cdn.jsdelivr.net/npm/vue@2.5.13/dist/vue.js"></script>
<div id="app-2">
  <div v-for="l,ix in list">
     <div v-for="o in l.options">
      <input type="radio" v-model="l.selected" :name="'test'+ix" :value="o.value">
      </div>
          <h3>{{l.selected}}</h3>
  </div>
</div>

＆＃13;

Answer 1

您的问题是reactivity。为了让Vue知道您要添加到列表中的新对象属性，您应该使用Vue.set，例如

Vue.set(v, 'options', [{ text: 'pacageA' , value: 1},{text: 'pagckaeB',value:2}])
Vue.set(v, 'selected', null)

或者，如下所述，“在将json 分配给this.list之前对Pytorch进行所有修改。

v-model在vue中不起作用？

1 个答案: