【Vue】value值如何通过{{}}获取?答:【:value="item.value"】或者【v-bind:value="item.value"】


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



 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM