tft每日頭條

 > 生活

 > axure9中繼器的使用方法圖解

axure9中繼器的使用方法圖解

生活 更新时间:2024-07-20 01:12:39

編輯導讀:在日常工作中,經常會用到中繼器進行增删改查操作,那我們可以如何使用Axure來進行相關操作呢?本篇文章裡,作者利用中繼器為我們展示了增删改查操作,讓我們一起來看一下。

axure9中繼器的使用方法圖解(0基礎學習中繼器的增删改查操作)1

中繼器增删改查對于熟悉的大神來講操作不難,網上教程也很多。但是對于初學者來講,網上教程普遍很難接受。今天老楊出一版0基礎學習的教程,希望大家采納。

一、為什麼要使用中繼器?

在做後台的時候往往會用到表格,而對于表格的增删改查這一聯動的動态實現則需要用到中繼器來實現,話不多少,直接上幹貨。

二、實現方式

元件準備:中繼器、動态面闆、矩形、文本标簽、文本框、按鈕;

以上元件是整個過程中需要的,不需要一開始就全部拉出來,首先做一個搜索框和列表(直接從元件區拖出來)。見下圖。

axure9中繼器的使用方法圖解(0基礎學習中繼器的增删改查操作)2

中繼器拖進來就是一列三行,可單擊中繼器在右邊的樣式中進行行列的增加删除以及内容的填寫(内容填寫需要通過交互傳輸進入中繼器,下面會介紹)。

雙擊中繼器,增加列,雙擊進入之後直接删掉原來的矩形,想要多少列就拖幾個矩形依次并排展示。這裡以5列操作展示,具體根據大家的需求自己拖。拖入之後不要退出,繼續給這5個矩形添加名稱,便于下面做交互能夠精确查詢。

axure9中繼器的使用方法圖解(0基礎學習中繼器的增删改查操作)3

備注完名稱之後雙擊空白處退出,進入下圖1,然後給中繼器做表頭(隻要能達到效果均可,建議使用矩形)如下圖2所示,根據箭頭給中繼器做内容填充。老楊隻填充中間三列内容,序号列需要用到index函數,操作列内容固定,所以隻填充中間三列,見圖3.

axure9中繼器的使用方法圖解(0基礎學習中繼器的增删改查操作)4

axure9中繼器的使用方法圖解(0基礎學習中繼器的增删改查操作)5

axure9中繼器的使用方法圖解(0基礎學習中繼器的增删改查操作)6

如上圖所示,内容填充之後需要通過函數輸送至中繼器。點擊交互,進入交互操作欄。交互→新建交互→每項加載時→設置文本。目标選擇中繼器中需要數據展示的元件,“值”依次使用函數。老楊之前選的是中間三列,也就是姓名、電話、地址列。

axure9中繼器的使用方法圖解(0基礎學習中繼器的增删改查操作)7

axure9中繼器的使用方法圖解(0基礎學習中繼器的增删改查操作)8

axure9中繼器的使用方法圖解(0基礎學習中繼器的增删改查操作)9

axure9中繼器的使用方法圖解(0基礎學習中繼器的增删改查操作)10

設置成功之後中繼器中的内容即已成功填充,接下來做搜索操作。老楊做的是姓名搜索,所以函數前半部分是item.num。點擊文本框→新建交互→文本改變時→添加篩選→中繼器。接下來根據圖片内容來操作。

axure9中繼器的使用方法圖解(0基礎學習中繼器的增删改查操作)11

到這裡,篩選操作已完成,先出這期教學,如果大家覺得有幫助,或者有建議的地方提出來,老楊再繼續更新接下裡的教學。

作者:小楊pm,老楊說産品

本文由@小楊pm 原創發布于人人都是産品經理,未經許可,禁止轉載。

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

,

更多精彩资讯请关注tft每日頭條,我们将持续为您更新最新资讯!

查看全部

相关生活资讯推荐

热门生活资讯推荐

网友关注

Copyright 2023-2024 - www.tftnews.com All Rights Reserved