使用Vue2如何實現三級連動

這篇文章主要為大家詳細介紹了Vue2仿淘寶實現省市區三級聯動，具有一定的參考價值，感興趣的小伙伴們可以參考一下

三級聯動，隨著越來越多的審美，出現了很多種，好多公司都仿著淘寶的三級聯動，好看時尚，so我們公司也一樣……為了貼代碼方便，我把寫在data裡面省市區的json獨立了出來，下載貼進去即可用，連結如下：vue.json(這個直接是個data，放入你的vue2專案中即可用，連結如下：vue.json(這個直接是個data，放入你的vue2專案中即可。（因為我的專案是用的vue2，所以，其他的屬性跟部落格內容是吻合的。請配合博客再下載此json）)。

首先頁面顯示如下：

然後我們縣級所在地區會出現三級連動，如下：（以下是片段，背景色未截取）

這個張什麼樣，以什麼形式出現，取決於貴公司的UI需求，我們公司是做成彈出層了。 。然後背景色透明，這裡為了節省流量，我只截取了一段，最後顯示如下：

#如果貴公司也跟我們需求一樣，希望這個可以幫到你們。下面是在vue2專案中寫的三級連動程式碼以及css樣式：