資訊專欄INFORMATION COLUMN
摘要：因項目需要，最近用寫了個二級聯(lián)動，剛開始用不熟悉，收集了兩種方法，這也是我借鑒別人的文章和思路才寫出來的，其實沒什么區(qū)別，可以參考下第一種這是第一種方法的部分代碼這是第一種方法的部分代碼計信院計信院軟件工程計算機科學(xué)與技術(shù)信息安全商學(xué)
因項目需要，最近用vue寫了個二級聯(lián)動，剛開始用vue不熟悉，收集了兩種方法，這也是我借鑒別人的文章和思路才寫出來的，其實沒什么區(qū)別，可以參考下：
第一種：
這是第一種方法的html部分代碼：
這是第一種方法的js部分代碼：
new Vue({
el: "#test",
data: {
selected: "計信院",
YX: [{
text: "計信院",
ZY: [{
text: "軟件工程"
}, {
text: "計算機科學(xué)與技術(shù)"
}, {
text: "信息安全"
}, ]
}, {
text: "商學(xué)院",
ZY: [{
text: "旅游管理"
}, {
text: "工商管理"
}, {
text: "行政管理"
}, ]
}, ]
},
computed: {
selection: {
get: function() {
var that = this;
return this.YX.filter(function(item) {
return item.text == that.selected;
})[0].ZY;
}
}
}
});
以上是一種方法，總體來說還不錯，而且默認(rèn)有第一項，無需在寫默認(rèn)項。
下面是另一種方法，這個方法和上面不同的是沒有默認(rèn)項，但是比上面哪種方法更好理解，這個方法怎么加默認(rèn)項，現(xiàn)在還沒搞明白，后續(xù)會繼續(xù)更新：
這是第二種方法的html部分代碼：
這是第二種方法的js部分代碼：
var vm = new Vue({
el:"#test",
data:{
YX:[
{
text:"計信院",
ZY:[
{text:"軟件工程"},
{text:"計算機科學(xué)與技術(shù)"},
{text:"信息安全"},
]
},
{
text:"商學(xué)院",
ZY:[
{text:"旅游管理"},
{text:"工商管理"},
{text:"行政管理"},
]
},
]
},
computed:{
selection: function() {
for (var i = 0; i < this.YX.length; i++) {
if (this.YX[i].text === this.A) {
return this.YX[i].ZY;
}
}
}
}
});
總體來說，兩種方法都可以，都值得借鑒一下
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/97625.html
摘要：在做后臺管理時，使用了搭配，請求方法使用了插件，在使用下拉框時，因為我需要獲取選中的選項中的其他值，因此需要傳入對象。 在做后臺管理時，使用了vue搭配elementUI，請求方法使用了axios插件，在使用下拉框時，因為我需要獲取選中的選項中的其他值，因此需要傳入對象。對select下拉框的文檔沒有讀的很仔細，百度過幾篇文章，也沒有理解他們表達的意思，然后自己又去看文檔，把他的屬性看...
摘要：注意和，供選擇器使用所屬分類請選擇分類所屬課程要先引用后端代碼前期遍歷，第一個下拉菜單的值從數(shù)據(jù)庫取出子課程添加處理的方法子課程添加下拉菜單二級聯(lián)動感覺寫的很詳細啦，歡迎和我一起探討哦，么么噠 一、想實現(xiàn)的效果： 用thinkphp+jquery+ajax實現(xiàn)二級聯(lián)動，當(dāng)所屬分類選擇媽咪英語時，下面所屬課程會自動列出媽咪英語下的子類。類似省市二級聯(lián)動 showImg(https:/...
摘要：二級聯(lián)動下拉菜單選擇應(yīng)用在在很多地方，比如說省市下拉聯(lián)動，商品大小類下拉選擇聯(lián)動。實現(xiàn)原理根據(jù)大類的值，通過把值傳給后臺處理，通過查詢數(shù)據(jù)庫，得到相應(yīng)的小類，并返回數(shù)據(jù)給前端處理。 二級聯(lián)動下拉菜單選擇應(yīng)用在在很多地方，比如說省市下拉聯(lián)動，商品大小類下拉選擇聯(lián)動。 實現(xiàn)的效果就是當(dāng)選擇大類時，小類下拉框里的選項內(nèi)容也隨著改變。實現(xiàn)原理：根據(jù)大類的值，通過jQuery把值傳給后臺PHP處...
摘要：還是那是老話，好記性不如爛筆頭會的東西，不經(jīng)常動手做，也就忘記了，下面是一個的聯(lián)動實用小例中函數(shù)中函數(shù) 還是那是老話，好記性不如爛筆頭 會的東西，不經(jīng)常動手做，也就忘記了，下面是一個jquery ajax select 的聯(lián)動 實用小例： ajaxTest.html jquery + ajax + php + select ...
摘要：架構(gòu)在編寫第三方庫的最佳實踐使用者無需了解內(nèi)部邏輯，通過實現(xiàn)接口即可輕松完成個性化配置。絕不使用，絕不使用奇技淫巧編寫艱深晦澀的代碼。 由來 LinkageRecyclerView 是一款基于 MVP 架構(gòu)開發(fā)的二級聯(lián)動列表控件。它是因 RxJava 魔法師 這個項目的需求而存在。 在最初尋遍了 GitHub 也沒有找到合適的開源庫（高度解耦、可遠程依賴）之后，我決心研究參考現(xiàn)有開源項目關(guān)于...
閱讀 3101·2021-11-24 11:14
閱讀 3570·2021-11-22 15:22
閱讀 3236·2021-09-27 13:36
閱讀 756·2021-08-31 14:29
閱讀 1354·2019-08-30 15:55
閱讀 1813·2019-08-29 17:29
閱讀 1168·2019-08-29 16:24
閱讀 2463·2019-08-26 13:48
