在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/Linux  網(wǎng)絡(luò)安全  HTML/ vue中，radio或者checkbox如何默認(rèn)選中

vue中，radio或者checkbox如何默認(rèn)選中

有一個(gè)radio或者checkbox選項(xiàng)框組，如下：

 <ul>
    <li class="item" v-for="item in attrList">
        <input :type="radio"
               :id="getId()"
               name="attrItem"
               :class="inputClass"
               :value="item.propertyValueId"
               v-model="checkedList">
        <label :for="getId(false)" :title="item.valueData">{{ item.valueData}}</label>
    </li>
</ul>
        

 data() {
        return {
            checkedList: [this.propertyValueId]
        }，
        props: {
            propertyValueId: {
                type: Number,
                default: null
            },
            // 0-radio  1-checkbox
            inputType: {
                type: Number,
                default: 1
            },
            
            attrList: {
                type: Array,
                default: []
            }
        }

其中，attrList的數(shù)據(jù)格式如下：

[         
  {
    propertyValueId: 1,
    valueData: "sku1 text alias"
  },
   {
    propertyValueId: 2,
    valueData: "sku1 text alias"
  },
   {
    propertyValueId: 3,
    valueData: "sku1 text alias"
  }
]

如何根據(jù)傳入的propertyValueId來(lái)默認(rèn)選中響應(yīng)的框？

回答
編輯回答
孤毒

把checkedList放到vue的data里面，且給它一個(gè)默認(rèn)值。BTW，radio button是單選，所以怎么能命名對(duì)應(yīng)的model叫checkedList呢？

2018年8月2日 04:53
編輯回答
不歸路
 <ul>
    <li class="item" v-for="item in attrList">
        <input :type="inputClass"
               :class="inputClass"
               :id="getId()"
               :value="item.propertyValueId"
               v-model="checkedList">
        <label :for="getId(false)" :title="item.valueData">{{ item.valueData}}</label>
    </li>
</ul>
                
data() {
    return {
        checkedList: this.inputType === global.INPUT_TYPE.CHECK_BOX ? [] : this.propertyValueId
    }
},            
   

 computed: {
        // checkbox or radio
        inputClass() {
            return this.inputType === global.INPUT_TYPE.CHECK_BOX ? 'checkbox' : 'radio'
        }
    }
    
    
    checkbox和radio要區(qū)別對(duì)待，radio不能放在數(shù)組里面。
2018年7月26日 15:35
編輯回答
執(zhí)念
<li class="item" v-for="item in attrList">
    <input type="radio"
           :id="getId()"
           name="attrItem"
           :class="inputClass"
           :value="item.propertyValueId"
           :checked="ifchecked(item.propertyValueId)"
           v-model="checkedList">
    <label :for="getId(false)" :title="item.valueData">{{ item.valueData}}</label>
</li>
然后再methods里面定義
ifchecked(prop){
    if(prop=='??'){//邏輯自己寫
    return true}
}
我測(cè)試過(guò)了，可以的，type前面的:去掉
2017年10月2日 04:48