javascript - vue2如何動(dòng)態(tài)生成checkbox默認(rèn)選中,獲取數(shù)據(jù)
問題描述
如題:
<li v-for='item in artistsList'> <img :src='http://m.cgvv.com.cn/wenda/item.user_avatar' alt=''> <p> <p>{{item.user_name}}</p> <span>{{item.user_job}}/{{item.user_country}}</span> </p> <label> <input type='checkbox' :value='item.user_id' v-model='userID'> </label></li>data () { return { userID:[], artistsList:[] } },
artistsList在mounted的時(shí)候,會(huì)自己去加載數(shù)據(jù)并生成列表,但是想要在input 生成的時(shí)候都是checked的狀態(tài),要怎么辦?如果將userID 設(shè)置為true 的時(shí)候可以,但是當(dāng)我點(diǎn)擊其中任何一個(gè)checkbox的時(shí)候都會(huì)全部操作,類似與全選取消全選。我的需求如下:1.生成的時(shí)候都是默認(rèn)選中的2.當(dāng)我選中操作任何一個(gè)checkbox的時(shí)候,data里面的userId數(shù)據(jù)都會(huì)動(dòng)態(tài)更新。說說吧友們的做法吧
問題解答
回答1:v-model='item.userID' 就行了,item.userID是布爾值哦
相關(guān)文章:
1. thinkPHP5中獲取數(shù)據(jù)庫數(shù)據(jù)后默認(rèn)選中下拉框的值,傳遞到后臺(tái)消失不見。有圖有代碼,希望有人幫忙2. javascript - 為什么很多網(wǎng)站不斷請求一個(gè)空的gif?是為了獲取數(shù)據(jù)同時(shí)避免跨域嗎?3. api接口登陸后獲取數(shù)據(jù),切換頁面顯示未登錄4. node.js - 用node做爬蟲,循環(huán)模擬接口獲取數(shù)據(jù),async/await怎么做到同步操作,控制流程?5. java - .jsp頁面用<%= %>的方式獲取數(shù)據(jù)存在一個(gè)很奇怪的問題6. javascript - angular 從后臺(tái)獲取數(shù)據(jù)渲染table,無數(shù)據(jù)時(shí)“暫無數(shù)據(jù)”7. javascript - 跨域讀取網(wǎng)站接口獲取數(shù)據(jù)遭遇堵截8. angular.js - angular指令通過"="不能獲取數(shù)據(jù)9. node.js - 關(guān)于electron主線程與渲染線程通信的問題(Menubar事件如何從渲染線程獲取數(shù)據(jù))10. javascript - 有一個(gè)異步獲取數(shù)據(jù)的函數(shù)A,其他依賴這個(gè)A得到的數(shù)據(jù)的函數(shù)是否都必須是異步的?
