如何使“buyingSelling”、“buyingSellingRent”、“rent”数组动态插入到代码中(见下面的html文档)
var showTreeCheckbox = new Vue({
el: '#tree-checkbox',
data: {
showActivity: false,
buyingSelling: [],
buyingSellingRent: [],
rent: [],
checkItems: [
{
key: 'Покупка-Продажа',
value: ['Жилой недвижимости', 'Коммерческой недвижимости', 'Земельных участков']
},
{
key: 'Покупка-Продажа-Аренда',
value: ['Приносящей доход недвижимости (Бизнеса)']
},
{
key: 'Аренда',
value: ['Жилой недвижимости','Коммерческой недвижимости']
}
]
}
})
<div id="tree-checkbox">
<div class="check1">
<input type="checkbox" id="ch1" v-model="showActivity">
<label for="ch1"><span>Посредник</span></label>
</div>
<div class="types-activity" v-if="showActivity">
<h3>Виды и направления деятельности:</h3>
<label>
<input type="checkbox" value="realtorServices">
<span>Риелторские услуги</span>
</label>
<div class="checkbox-tree-items">
<ul>
<li v-for="(checkItem,index) in checkItems">
<label>
<input type="checkbox" :value="checkItem.value" >
<span>{{ checkItem.key }}</span>
</label>
<ul>
<li v-for="(subItem,index2) in checkItem.value">
<label>
<input type="checkbox" :value="checkItem.value[index2]+index">
<span>{{ subItem }}</span>
<span>{{ }}</span>
</label>
</li>
</ul>
</li>
</ul>
</div><!-- checkbox-tree-items -->
</div><!-- types-activity -->
</div>
此处需要替换模型:<input type="checkbox" :value="checkItem.value[index2]+index">
为了使选中的复选框进入它们的数组。
目前尚不清楚您稍后将如何处理它:
添加到您的代码以可视化更改:
选择感兴趣的信息时,信息的输出将大致如下
checkbox
要显示索引数组,请相应地替换:
PS带有索引的变体要成功得多。