1. 插入元素

在页面编辑中搜索“同步数据”并添加（具体添加步骤请参考手机系统相机）。建议将同步数据元素添加在命名为“数据”的层中，这样方便页面的整理（如何添加层）。

2. 元素设置说明

在元素上右键选择“获取数据元素设置”，弹出对话框。

| 是否开启调试模式：如果开启调试模式，则页面不会加载真实数据，而是使用调试数据。您可以在本元素逻辑中查看默认初始化的数据的具体信息。

| 是否页面初始化时自动同步：如果开启，则本元素会在页面打开时自动触发一次同步(发一次ajax请求)。

| 同步数据url：填写同步数据的url，若不填写，则默认为本页面；填写的url可以按照标准格式添加自定义参数。url需以"/"开头，如:/v/geta.json。

| 同步数据时的默认参数：设置同步数据时的默认参数，如果提交元素或者提交数据层变量有同名参数，会被提交元素或者提交数据层变量的值覆盖。本参数需写为json格式。

| 需要提交的元素：设置需要将对应值传给后端的元素，该元素必须要有name，本参数需要填写选择器，如: #id。

| 需要提交的页面数据层的变量：设置页面的数据层中哪些变量需要提交到后端，填入变量名即可，本参数需要填写变量名并以逗号分割，如: name1,name2。

| 监听变量：设置本元素监听哪些变量，当监听变量的值改变时，自动重新同步数据。本参数需要填写变量名并以逗号分割，如: name1、name2.。也可以解释为监听变量，当变量的值有变动时，自动触发本元素所设置的”服务器URL“所对应的脚本，并将脚本执行之后返回的数据，更新回页面的绑定变量。通过绑定，数据变化会更新页面视觉效果。

| 设置变量名映射：设置需要将获取到的某些变量名改为另一个变量名，格式为json格式{"旧名": "新名", "旧名2": "新名2",...}，如，将shangpingid变为id写为{"shangpingid": "id"}本元素监听那些变量，当监听变量的值改变时，自动重新同步数据。本参数需要填写变量名并以逗号分割，如：name1、name2, 如没有本需求则留空即可。

3. 示例

（1）：如何使用测试数据？

效果：

实现步骤：

a、在需要测试的地方添加数据绑定→文本内容绑定→填写对应的名字（test）；

 b、在页面编辑界面，重新拖拽一个12的布局，右键紫色部分，点击将“当前行转化为层”并命名为数据。同时点击“添加元素”插入“同步数据元素”；

c、右键元素点击“获取数据元素设置”，是否开启调试模式选择开启；

d、在“同步数据”元素上添加绑定变量初始化，初始化的内容就是对应的测试数据{"test":"text"}

（2）：如何使用监听数据层变量？有什么作用？

效果：当监听变量发生改变时，页面重新请求数据，呈现新的页面。

实现步骤：

a、添加“同步数据元素”，步骤同上；

b、右键添加的元素，单击“获取数据元素设置”

c、在监听变量部分写需要监听的变量名。（如果变量名为a就直接填写a，为b就直接填写b）

（3）：如何通过事件触发同步？

效果：点我触发同步（按“F12”，查看network，单击XHR，单击按钮，可以看到触发同步数据成功）

实现步骤：

a、在触发元素上添加触发逻辑，这里以按钮为例。右键点击逻辑，添加数据绑定编程_vm.abc("true");

b、在数据层中添加“同步数据元素”，右键选择逻辑→数据绑定→属性绑定{"data--sync":abc}