var historyList = new Vue({
el: '#historyList',
data: {
items: [
//{text:'3000吨以下',value:'0-3000'},
//{text:'5000吨 至 1.0w吨',value:'5000-10000'},
//{text:'55吨 至 88吨',value:'55-88'}
]
}
})
<ul id="historyList" >
<li v-for="item in items" class="tonList">
<input type="checkbox" :value="item.value"/>
<label>{{item.text}}</label>
</li>
</ul>
function getHistory() {
var data = localStorage.getItem('tonnage_history');
if (data != '' && data != null) {
// dataTextAndValue {3000吨 至 5000吨,5000吨 至 1.0w吨,4吨 至 8吨:3000-5000,5000-10000,4-8}
var dataTextAndValue = data.split(':');
// dataText [3000吨 至 5000吨,5000吨 至 1.0w吨,4吨 至 8吨]
var dataText = dataTextAndValue[0].split(',');
// dataValue [3000-5000,5000-10000,4-8]
var dataValue = dataTextAndValue[1].split(',');
var dataItem=new Array();
for(var i=0;i<dataText.length;i++){
dataItem[i]={text:dataText[i],value:dataValue[i]}
}
// dataItem
// [ {text:'3000吨以下',value:'0-3000'},
// {text:'5000吨 至 1.0w吨',value:'5000-10000'},
// {text:'55吨 至 88吨',value:'55-88'}]
historyList.items=dataItem;
} else {
}
console.log(data);
console.log(dataItem);
console.log(historyList.items);
}
【1】 <input type="checkbox" :value="item.value"/>
不是用双括号,直接用引号包围就行,前边加个冒号
【:】相当于【v-bind:】
【2】 for(var i=0;i<dataText.length;i++){
dataItem[i]={text:dataText[i],value:dataValue[i]}
}
js的数组还可以这样用,牛逼!
https://cn.vuejs.org/v2/api/#v-bind
所有评论(0)