1. 程式人生 > >來!拋開input的radio!在Vue裡面寫個單選器!

來!拋開input的radio!在Vue裡面寫個單選器!

import icon from "#/common/icon/icon" export default { components: {icon}, data() { return { //自己隨便捏造幾項吧! cateInfos:[ {productTypeName: "測試1", productTypeID: 1, isON: false}, {productTypeName: "測試2"
, productTypeID: 2, isON: false} ], //控制按鈕的變數 inputIsOk: false, //選擇的ID selectId:0, } }, methods: { select(index, id) { //按鈕改變 this.inputIsOk = true
; //記錄選中的值 this.selectId = id; //單選效果 //cates是引用,改變cates就是改變cateInfos let cates = this.cateInfos; for (let i in cates) { //注意i是個字串 if (parseInt(i) === index) { //點亮
cates[i].isON = true; } else { //變灰 cates[i].isON = false; } } console.log(JSON.stringify(cates)); }, cateOK(){ if(this.inputIsOk){ //點選事件 console.log('ok'); } //否則就是點不動,相當於disabled } } }