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

鍍金池/ 問答/HTML5  HTML/ vue 根據(jù)單選框選擇的不同值,來設置對象button的class

vue 根據(jù)單選框選擇的不同值,來設置對象button的class

clipboard.png
根據(jù)單選框選擇的樣式,來設置對象button的class(buybtn-1,buybtn-2,buybtn-3,buybtn-4)

<button type="button" class="hide" title="馬上買" ></button>
<div class="form-row">
    <label class="radio-inline">
        <input type="radio" v-model="buyBtnStyle" name="BBS" id="inlineRadio1" value="buyBtn1"> 樣式1
    </label>
    <label class="radio-inline">
        <input type="radio" v-model="buyBtnStyle" name="BBS" id="inlineRadio2" value="buyBtn2"> 樣式2
    </label>
    <label class="radio-inline">
        <input type="radio" v-model="buyBtnStyle" name="BBS" id="inlineRadio3" value="buyBtn3"> 樣式3
    </label>
    <label class="radio-inline">
        <input type="radio" v-model="buyBtnStyle" name="BBS" id="inlineRadio4" value="buyBtn4"> 樣式4
    </label>
</div>
回答
編輯回答
臭榴蓮

建議參考官網(wǎng) Class與Style綁定

2018年3月26日 17:56
編輯回答
你好胸
<button type="button" :class="['hide',buyBtnStyle]" title="馬上買" ></button>
<div class="form-row">
    <label class="radio-inline" v-for="(item,index) in [{value:'buyBtn-1',name:'樣式1'},{value:'buyBtn-2',name:'樣式2'}]" :key="index">
        <input type="radio" v-model="buyBtnStyle" name="BBS" :value="item.value"> {{item.name}}
    </label>
</div>
2018年8月27日 06:07
編輯回答
凹凸曼
<div :style="{'margin-top': index === 0 ? 0 : 6.5 + 'px'}" :class="{'img_gray': thirdQty === 0}"></div>
data(){
    return {
        index: 0,
        thirdQty: 0
    }
}
2017年5月9日 23:03