1. 級聯選擇器實現省市縣街道四級聯動

目前累計服務客戶上千多家，積累了豐富的產品開發(fā)及服務經驗。以網站設計水平和技術實力，樹立企業(yè)形象，為客戶提供網站建設、成都網站制作、網站策劃、網頁設計、網絡營銷、VI設計、網站改版、漏洞修補等服務。成都創(chuàng)新互聯始終以務實、誠信為根本，不斷創(chuàng)新和提高建站品質，通過對領先技術的掌握、對創(chuàng)意設計的研究、對客戶形象的視覺傳遞、對應用系統(tǒng)的結合，為客戶提供更好的一站式互聯網解決方案，攜手廣大客戶，共同發(fā)展進步。

2. 下拉框實現省市縣街道四級聯動

? 首先我們可以看到[Element ui](組件 | Element) 官網里的級聯選擇器的數據其實是樹形的，所以我們可以在后端就把數據構造成樹形結構的。有需要的小伙伴可以看我的另一篇博客：java–list轉樹形結構，這里就不再多講。

1. 如果后臺傳過來的數據是樹形結構的，那么我們直接綁定數據就可以了：

后臺傳過來的數據：

效果：

2.如果后臺傳過來的不是樹形結構，那我們就要在前端把它構造成樹形結構。

后臺傳過來的數據：

前端代碼（主要代碼是使用遞歸將扁平數據構造為樹形數據）：

效果：

至于為什么要判斷根節(jié)點的children是否有值。如果不判斷，就會出現children是一個空數組，對比下面兩張圖就知道了。

判斷后：

沒有判斷：

? 如果后端返回的數據也是扁平數據，那么我們可以先篩選出省份數據（pid==0），在改變省份數據的時候，又篩選出市級數據，也就是市級的pid等于省級的id，以此內推即可；代碼如下：

效果：

解釋得可能不是那么清楚，大家多多包涵!

你是否還在尋找穩(wěn)定的海外服務器提供商？創(chuàng)新互聯www.cdcxhl.cn海外機房具備T級流量清洗系統(tǒng)配攻擊溯源，準確流量調度確保服務器高可用性，企業(yè)級服務器適合批量采購，新人活動首月15元起，快前往官網查看詳情吧