如果模型是陣列的一部分，如何設定模型的默認值？
new Vue({
data() {
return {
value: 1,
values: [],
products: [{
name: 'test 1',
},
{
name: 'test 2',
}]
}
},
created() {
for (i = 0; i < products.length; i ) {
this.values.push(1);
}
}
}).$mount('#app')@import url(https://unpkg.com/vue-range-component@1.0.2/dist/vue-range-slider.min.css);
* {
margin:0;
padding:0;
box-sizing:border-box;
}
.app-content {
padding:40px 15px;
}<script src="https://unpkg.com/[email protected]/dist/vue.js"></script>
<script src="https://unpkg.com/[email protected]/dist/vue-range-slider.min.js"></script>
<div id="app">
<div class="app-content">
<div v-for="(product, index) in products">
<p>
{{ product.name }}: {{ values[index] }}
</p>
<vue-range-slider v-model="values[index]" min="0" max="10"></vue-range-slider>
</div>
</div>
<div>example of working if not an array:</div>
<p>
this works: {{ value }}
</p>
<vue-range-slider v-model="value" min="0" max="10"></vue-range-slider>
</div>正如您從上面的示例中看到的那樣，陣列滑塊在您開始滑動之前不會顯示冒號后的數字，如果您在data（如在單個值中）設定默認值，那么它可以正常作業
所以我的問題是，當模型是一個未知大小的陣列時，如何將默認值系結到模型（產品是從 api 加載的，所以不會總是有 2 個）？
uj5u.com熱心網友回復：
嘗試
for (i = 0; i < this.products.length; i ) {
this.values.push(1);
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/409225.html
標籤：