在本章中，你将學會使用全局變量和中繼器建立一個需求文檔生成器網站。
項目背景
在産品日常工作當中，少不了的一項核心工作是編寫産品需求文檔，而産品需求文檔的編寫往往耗費産品經理很長的工作時間。在産品需求文檔格式固定的情況下，我們能夠将編寫文檔的工作簡化，比如隻提供核心的産品資訊，由某種工具按照固定的文檔格式，自動補充文檔呢？
有了這個想法之後，我們拿一個表單的搜尋條件為例，産品需求文檔想要描述清楚這一部分的需求，常常格式為：
搜尋條件名稱，是否必填，控件名稱，控件提示文字，資料來源…
按照這個邏輯，我們希望填寫一些必要的資訊，而其他文字由系統自動生成。
說幹就幹！
項目搭建
首先，建立一個新項目，命名為DocumentGenerator。
頁面樣式-基礎架構
為了讓頁面更加美觀，我們先建構基礎的架構背景。
首先填充頁面顔色為#F0F2F5，然後拖入兩個“矩形1”元件，将線段線寬設定為0，圓角半徑設定為8，再調整它們的相對位置，就建構了一個背景架構。
左邊的矩形我們作為編輯區，右邊的矩形我們作為輸出内容的展示區。
基礎樣式-編輯區
我們分析下下面一段需求文檔文字的内容：
業務地區：必填/必選，下拉多選，placeholder為請選擇，可選項為該使用者資料權限下可通路的業務地區名稱；
我們需要幾個元件來獲得這些内容：
輸入框：輸入标題
單選按鈕：是否必填/必選
下拉選擇框：控件類型、提示文字
多行文本框：其他說明文字
确定好思路後，我們開始建構基礎的元件。
首先，是輸入框。
拖入一個“文本标簽”元件，修改内容為“标題”。
再拖入一個文本框元件，命名為“title”，設定文字字号為14，邊框線段顔色為#E6E6E6，邊框圓角半徑為4，内部文字左側邊距為10。
在互動工具欄中中，設定“滑鼠懸停時的樣式”，設定線段顔色為#1890FF，設定提示文字為“請輸入”，隐藏提示為“獲得焦點”。
接下來，是單選按鈕。
單選按鈕我們使用的一個圓形元件和文本标簽元件，組合而成的單選按鈕的樣式。
基礎樣式和互動這裡就不多贅述了，在前面基礎元件的使用的章節中有詳細的說明，簡要的幾個邏輯，一個是點選時的選中狀态為真，單選的選項都需要設定為同一個選項組中，預設有一個選項載入時為真，以及圓形、文字選中時的顔色設定為#1890FF。
接下來，是元件類型。
元件類型為獲得使用的元件是輸入框還是下拉選擇框，它是一個自定義實作的下拉單選的元件。
元件類型的互動會稍微複雜一點，這裡使用動态面闆将所有内容包裹在裡面。
内部元件有一個矩形（輸入框）作為本文接收方，然後在這個文本下有一個表格，展示可選的選項。
互動動作也會稍微複雜一點，基礎的邏輯是：點選下拉選擇框，展示（顯示，向下展開）可選項，點選選項後收起（隐藏，向下展開）可選項，并将輸入的内容回寫到文本框中。
接下來，是多行文本框。
拖入一個“文本域”元件，和文本框設定的樣式一緻，隻是他的高度會更高一些。
最後，是主要按鈕。
拖入一個“主要按鈕”元件，調整它的位置和樣式、尺寸，作為觸發按鈕使用。
在這裡我們可以看到一個核心的設計原則：統一性原則。
我們使用元件的高度，無論是輸入框、下拉選擇框、按鈕，它們的元件的高度都是40，這樣能讓我們的頁面看起來具有整體性。
頁面樣式-展示區
對于展示區域，我們這裡很簡單，每當我們确定好内容後，展示區域就增加一行文字。
這裡我們使用到了“中繼器”元件，它可以通過“添加行”和指派的互動，展示我們最終結果的資料。
拖入一個“中繼器”元件，命名為“output”。
進入到中繼器内頁，調整示例的矩形的尺寸為1080*40，并将線寬設定為0。
在中繼器資料欄，删掉所有示例資料。
以上，我們就完成了基本頁面樣式的繪制。
互動動作-全局變量
按照Axure的指派邏輯，輸入框我們可以直接獲得裡面的文字，但其他不行。
其他的元件是我們自己完成的互動，像單選按鈕、下拉單選，那這些内容，我們可以采用全局變量獲得它們的值。
首先，定義3個全局變量，分别為required是否必填，預設值為“必填/必選”，然後是元件類型type，預設值為“輸入框”，還有placeholder提示文字，預設值為“請輸入”。
下面，我們來更新全局變量的值。
首先是單選按鈕，但在互動工具欄中，點選單選按鈕的選項時，我們更新全局變量的值。
然後是下拉框。
在點選下拉框每一個選項時，設定全局變量的值為對應的内容。示例：點選“輸入框”選項，設定變量值type類型為“輸入框”，設定placeholder提示文字為“請輸入”。
全局變量指派完成後，我們來完成将編輯區内容指派到展示區的互動。
互動動作-添加行
選中“确定”按鈕，在“互動”工具欄中新增互動，選擇“單擊時”，選擇“添加行”，設定目标為“output”中繼器，點選“添加行”，在“添加行到中繼器”彈窗中點選fx，打開“編輯值”彈窗。
然後就是添加行指派的過程。
我們定義了5個局部變量，來獲得我們想要的值。
LVAR1：文本文字-title-标題名稱
LVAR2：全局變量-required-是否必填
LVAR3：全局變量-type-元件類型
LVAR4：全局變量-placeholder-提示文字
LVAR4：文本文字-explain-多行文本文字
我們在組裝資料的時候，我們按照需要的格式使用标點符号隔開。
這樣，我們就完成了編輯區内容指派到展示區的互動動作。
互動動作-清空内容
為了友善我們連續輸入，我們點選“确定”按鈕時除了添加行之外，還增加了2個互動動作，用來清空标題内容和其他說明内容。
項目預覽
完成并儲存後，我們在浏覽器中預覽下效果：
哈哈哈，效果不錯！
為了讓這個項目能夠公開通路，我們可以生成html檔案，然後釋出到gitHub或者gitee中，這樣就可以将網站分享給朋友們了。