重慶分公司
重慶分公司
如何在vue中實(shí)現(xiàn)下拉框功能-創(chuàng)新互聯(lián)
如何在vue中實(shí)現(xiàn)下拉框功能？很多新手對(duì)此不是很清楚，為了幫助大家解決這個(gè)難題，下面小編將為大家詳細(xì)講解，有這方面需求的人可以來(lái)學(xué)習(xí)下，希望你能有所收獲。
站在用戶(hù)的角度思考問(wèn)題，與客戶(hù)深入溝通，找到山東網(wǎng)站設(shè)計(jì)與山東網(wǎng)站推廣的解決方案，憑借多年的經(jīng)驗(yàn)，讓設(shè)計(jì)與互聯(lián)網(wǎng)技術(shù)結(jié)合，創(chuàng)造個(gè)性化、用戶(hù)體驗(yàn)好的作品，建站類(lèi)型包括：
做網(wǎng)站、成都網(wǎng)站設(shè)計(jì)、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣、
域名注冊(cè)、
虛擬主機(jī)、企業(yè)郵箱。業(yè)務(wù)覆蓋山東地區(qū)。
html部分：v-for循環(huán)出的結(jié)構(gòu)
{{item.name}}
{{item1.AttrValueName}}
js部分：
data() {
return {
isShowSize: false,
i: -1
};
},
//實(shí)現(xiàn)點(diǎn)擊哪個(gè)下拉框顯示
clickSize (item, index) {
this.i = index;
this.isShowSize = !this.isShowSize;
},
//實(shí)現(xiàn)選取下拉值
getSize (item, item1) {
this.item.name = item1.AttrValueName;
this.isShowSize = !this.isShowSize;
},下面看下vue--select組件的使用與禁用
業(yè)務(wù)：消息推送方式有兩種，為“微信”和“郵件”，微信發(fā)送時(shí)需要選擇“要發(fā)送的應(yīng)用程序”，郵件發(fā)送時(shí)不需要
微信發(fā)送時(shí)，頁(yè)面如下：
郵件發(fā)送時(shí)，選擇器不可用，頁(yè)面如下：
雖然官網(wǎng)上沒(méi)有給出具體的例子，但可從屬性中查到 “disabled”屬性，
| 屬性 | 說(shuō)明 | 類(lèi)型 | 默認(rèn)值 |
|---|
| disabled | 是否禁用 | Boolean | false |
實(shí)現(xiàn)：
添加disabled屬性，寫(xiě)成如下紅色標(biāo)記格式；定義一個(gè)isAble變量，用來(lái)存放TRUE和FALSE值，決定此選擇框是否可用。
v-bind:disabled="isAble" clearable v-model="dataAgentEntity.ID" >
{{ item.name }}
export default {
data(){
return{
isAble: false,//select下拉框是否可用
}
}
然后就是邏輯中操作變量isAble的值，改變組件的可用禁用狀態(tài)了
methods:{
Test(){
var vm = this;
if (vm.alertType == '郵件') {
vm.isAble = true; //不可用
}
}
}為什么要使用Vue
Vue是一款友好的、多用途且高性能的JavaScript框架，使用vue可以創(chuàng)建可維護(hù)性和可測(cè)試性更強(qiáng)的代碼庫(kù)，Vue允許可以將一個(gè)網(wǎng)頁(yè)分割成可復(fù)用的組件，每個(gè)組件都包含屬于自己的HTML、CSS、JavaScript，以用來(lái)渲染網(wǎng)頁(yè)中相應(yīng)的地方，所以越來(lái)越多的前端開(kāi)發(fā)者使用vue。
看完上述內(nèi)容是否對(duì)您有幫助呢？如果還想對(duì)相關(guān)知識(shí)有進(jìn)一步的了解或閱讀更多相關(guān)文章，請(qǐng)關(guān)注創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計(jì)公司行業(yè)資訊頻道，感謝您對(duì)創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計(jì)公司的支持。
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無(wú)理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、網(wǎng)站設(shè)計(jì)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性?xún)r(jià)比高”等特點(diǎn)與優(yōu)勢(shì)，專(zhuān)為企業(yè)上云打造定制，能夠滿(mǎn)足用戶(hù)豐富、多元化的應(yīng)用場(chǎng)景需求。
新聞名稱(chēng)：如何在vue中實(shí)現(xiàn)下拉框功能-創(chuàng)新互聯(lián)
網(wǎng)頁(yè)地址：http://weahome.cn/article/ghjgp.html
