本文用案例說(shuō)明一下網(wǎng)頁(yè)二級(jí)聯(lián)動(dòng)交互怎么做，主要是表單元件結(jié)合動(dòng)態(tài)面板來(lái)實(shí)現(xiàn)~

步驟如下

（1）準(zhǔn)備下拉列表框

選擇一個(gè)表單元件，我們要選擇的是“下拉列表框”，對(duì)表單元件進(jìn)行簡(jiǎn)單的美化操作（如下圖所示）。

（2）添加動(dòng)態(tài)面板

在“市”后面添加一個(gè)動(dòng)態(tài)面板，動(dòng)態(tài)面板的名稱命名為“市”。

（3）設(shè)置“省”后面的下拉列表框

這次我們的事例簡(jiǎn)單演示一下三個(gè)省，安徽省、山東省、河北省，選擇每個(gè)省時(shí)，相對(duì)應(yīng)的是省下面的市。雙擊下拉列表框，添加三個(gè)省的名稱。

（4）設(shè)置“市”后面的動(dòng)態(tài)面板

因?yàn)橐鋈齻€(gè)省對(duì)應(yīng)下面的市，所以在“市”的動(dòng)態(tài)面板下面添加三個(gè)動(dòng)態(tài)面板。添加完之后，重命名。

雙擊“安徽省”動(dòng)態(tài)面板，復(fù)制或添加一個(gè)下拉列表框到動(dòng)態(tài)面板里面，然后雙擊進(jìn)行編輯，添加安徽省下面所有對(duì)應(yīng)的市（如下圖）。

下面兩個(gè)省，如同安徽省的操作一樣，操作兩次。

（5）回到index主面板，對(duì)省后面的下拉列表框添加“交互事件操作”

雙擊“選項(xiàng)改變時(shí)”。

同樣的方法操作下面兩省即可（如下圖）。

網(wǎng)頁(yè)二級(jí)聯(lián)動(dòng)交互完成了，你可以驗(yàn)證一下~

本文由 @葛園園 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來(lái)自Unsplash，基于CC0協(xié)議