跨页面传值 | Pass Text to Next Page

在本教程中,你将学习如何使用全局变量进行跨页面传值。【原型预览】

1、元件和页面设置
  1. 打开一个新的RP文件,并在画布中打开Page 1
  2. 元件库中拖拽一个文本框元件和一个按钮元件到画布中。
  1. 在项目中增加一个新的页面(Page 2)并在画布中打开。
  2. 拖拽一个矩形元件到画布中。
2、创建一个全局变量用来存储用户输入的值
  1. 在顶部菜单中,打开项目>全局变量设置
  2. 全局变量对话框中,点击添加来添加一个新的全局变量,命名为TextInputVar。
  3. 点击确定按钮关闭对话框。
3、获取用户输入的内容并传到下一个页面

将文本框中输入的内容赋值给全局变量

  1. 在画布中打开Page 1,然后选择按钮元件。
  2. 交互面板中点击新建交互
  3. 在弹出的列表中选择单击时事件,然后再选择设置变量值
  4. 目标下拉列表中选择TextInputVar变量。
  5. 设置为下拉列表中,选择元件文字,然后在下面的元件下拉列表中选择文本框。
  6. 点击确定按钮保存操作。

链接到Page 2

  1. 在按钮元件选中的状态下,点击单击时事件下的插入动作图标,然后在弹出的下拉列表中选择打开链接
  2. 链接到的下拉列表中选择Page 2,然后点击确定按钮保存操作。
4、在Page 2页面上显示用户输入的内容
  1. 在画布中打开Page 2,然后在交互面板中点击新建交互
  2. 在弹出的列表中选择页面加载时,然后选择设置文本
  3. 目标下拉列表中选择矩形元件。
  4. 点击文本框右侧的fx图表打开编辑文本对话框。
  5. 在对话框的顶部,点击插入变量或函数,在弹出的下拉列表中,选择全局变量下的TextInputVar
    此时对话框顶部的文本框中应该会显示:[[TextInputVar]]。(在Web浏览器中,括号中的表达式将会显示为变量的值。)
  6. 点击确定按钮关闭编辑文本对话框,然后再次点击确定按钮保存设置文本动作。
5、预览交互
  1. 预览Page 1页面,并在文本框中输入一些内容。
  2. 点击按钮跳转到Page 2页面,你刚才在文本框中输入的内容就会显示在矩形元件中。
评论(0)

发表评论

电子邮件地址不会被公开。 必填项已用*标注