Vuejs使用整数数组填充select元素

时间:2017-02-18 12:00:16

标签: vue.js

我想使用Vuejs填充数字1到100的html选择字段。我试过了:

<div id="selector">
    <select id='row_selector' class="form-control" v-model="intArray"></select>
</div>

<script type="text/javascript" src="path_to/vue.js"></script>
<script>
const MAX_VAL = 100; 
var numArray = Array.apply(null, {length: numArray}).map(Number.call, Number)
var app = new Vue({
    el: '#selector',
    data: {
        "intArray": numArray
    }
})

但是select元素是空的。我是否需要使用指令来填充它?

1 个答案:

答案 0 :(得分:4)

查看

<div id="app">
  <select v-model="selected">
    <option v-for="n in 100" :value="n">{{ n }}</option>
  </select>
  <p>
   Selected: {{ selected }}
  </p>
</div>

组件

new Vue({
  el: '#app',
  data: {
    selected: ''
  }
})