中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

文章分享了關于利用Axure RP8中繼器實現表單的增刪改的具體操作過程，一起來學習下。

原型演示：

使用場景：適用于模塊內增加擴展同名稱字段

交互需求：

1. 字段可以輸入并記錄內容（字段輸入長度不超過20字）；
2. 單擊添加，增加一個字段；
3. 單擊字段后面的×，刪除對應字段；
4. 增刪字段，項目序號自動增減；

01 準備工作

矩形元件一個，中繼器一個。

剛從Default元件庫拖出中繼器內默認有一些默認的元件和設置，我們需要對中繼器做一些處理，點擊中繼器，右側它的屬性頁，刪除第一、二行，保留第三行（為什么保留第三行呢，因為需要頁面載入時有一個初始的字段）。

然后雙擊中繼器進入中繼器編輯頁面,把矩形框刪掉，在中繼器內放入我們需要的元件，做好元件命名。

最后返回原頁面，準備制作交互了。

02 制作交互

2.1 中繼器加載數據集到元件

點擊中繼器，中繼器屬性面板選擇每項載入時，當打開網頁或者添加數據時候，為中繼器加載數據集到元件。

為了實現編號自增，項目編號的動作設置為[[item.index]]，[[item.index]]需要手動輸入，而內容輸入框的動作可直接進入函數選框選擇[[item.EditText]]（EditText在元件準備時已經命名好了，有疑問的同學們可以翻翻上面圖片）。

2.2 內容輸入框設置

剛剛在準備基礎元件的時候已經拖出了文本框，此時為了更直觀地向用戶表達字段可輸入我們需要設置一個提示語和設置元件最大輸入文字數為20，如下圖。

2.3 添加行

在元件準備的時候，我們已經準備了一個添加按鈕，也在中繼器屬性面板為中繼器數據集添加命名了EditText列，現在我們就要為添加按鈕配置點擊動作，為中繼器“添加行”。

新增行-選中中繼器-點擊新增行-選中中繼器數據集-點擊新增行-點擊確定。

2.4 刪除行

單擊字段后面的×，刪除對應字段，我們這個案例不需要用到標記行這個功能，直接為刪除按鈕配置點擊動作就可以了。

到了這一步我們以為已經基本完成了，預覽一下，咦，我們發現，每次添加行或者刪除行，都會清空我們已輸入的內容，這個怎么呢？為了讓中繼器的數據集記錄下我們已輸入的內容，我們還需要做“更新行”的操作。

2.5 更新行

字段編輯后需要記錄編輯內容就是需將用戶輸入內容記錄到中繼器中，此時我們只需要把用戶輸入的內容獲取到并通過某個交互動作傳給“EditText”列就可以了。下面我用到的是“失去焦點時”這個交互，選擇的動作是“更新行”。

到這里就真的完成了，大家可以預覽一下！

回顧：

（1）增刪行，序號是如何實現自增的呢？

回答：項目編號的動作設置為[[item.index]]。

（2）增刪行后，清空已輸入內容怎么辦？

回答：需要更新行。

本文由 @茗一 原創發布于人人都是產品經理，未經作者許可，禁止轉載。

題圖來自Unsplash，基于CC0協議。