本文作者帶大家一起來看一下Axure中如何實現(xiàn)省市級聯(lián)的效果，enjoy~

喜歡網(wǎng)購的小伙伴們可能會發(fā)現(xiàn)這樣一種現(xiàn)象：當(dāng)需要添加新的郵寄地址的時候，我們首先是會先選擇省份，然后再選擇城市。有趣的就在于，我們選擇不同的省份，那么后面城市的可選擇范圍是不一樣的，這樣是不是很方便呢？

今天呢，我就帶大家一起來看一下Axure中如何實現(xiàn)省市級聯(lián)的效果。

話不多說，還是按照我們以往的套路來講解。

下文將從3個方面來展開：

1. 需求分析

首先先來看一下這個具體的需求是什么？

需求比較簡單：會先選擇省份，然后再選擇城市，并且城市的可選擇范圍是根據(jù)前面選擇的省份動態(tài)顯示的。

從上面的描述，我們看到關(guān)鍵詞“動態(tài)顯示”，腦瓜子里是不是會聯(lián)想到Axure中的動態(tài)面板呢？

沒錯，今天的主角還是它，動態(tài)面板。

2. Axure關(guān)鍵點分析

這里用到動態(tài)面板的是“市”字段，它是根據(jù)省份的選擇來動態(tài)顯示相應(yīng)的值

2.1 “省”字段下拉列表

這個相對比較簡單：

2.2 “市”字段下拉列表

設(shè)置2種狀態(tài)與上面的“省”字段相對應(yīng)

并設(shè)置每種狀態(tài)的列表值

2.3 設(shè)置“省”字段交互效果

交互時點為選項改變時，設(shè)置“市字段對應(yīng)的動態(tài)面板狀態(tài)”

其中，這里用到局部變量p，來代表選中的省份值

3. 效果展示

最后，我們來看一下最終效果，網(wǎng)址為：https://jcfi1s.axshare.com

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

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