Vue.js 绑定动态模型答案

【问题标题】：Vue.js Binding Dynamic ModelsVue.js 绑定动态模型
【发布时间】：2015-11-12 21:37:49
【问题描述】：

我正在尝试从一组动态属性中创建一系列选择标签。

但是，我在获取数据之前不知道型号名称，所以我需要使用动态值创建 v-model 绑定。

有什么想法吗？

JSfiddle上的代码

HTML

<div id="selectApp">

<div v-repeat="dynamicSelects">
    
    {{key}}

    <!--THIS WORKS: <select v-model="setReps1" options="setReps1"></select> -->
    <select v-model="{{key}}" options="{{key}}"></select>

</div>  


<pre>{{$data|json}}</pre>

JS

new Vue({

    el: document.querySelector("#selectApp"),

    data: {

        dynamicSelects: [
            {key: "setReps1"}
        ],

        setReps1: [
          
            { text: '0', value: '0' },
            { text: '1', value: '1' }
        
        ]

    }
});

*更新提琴手链接*

【问题讨论】：

标签： vue.js

【解决方案1】：

所以我想出了一个方法来做到这一点，创建一个选择组件。

Codepen

<script id="sselect-template" type="x-template">
  <select v-model="data.selected" options="data.items"></select>
</script>

<div id="app">
   <div v-repeat="lists">
       <sselect data="{{lists[$index]}}"></sselect> 
   </div>
</div>

【讨论】：