微搭低代码入门教程-数据绑定

目录

01 总体介绍

02 应用介绍

03 页面介绍

04 hello,world

05 变量定义

我们上一节介绍了低代码中如何创建变量的知识点，本节我们介绍一下数据绑定。

啥是数据绑定呢？这个要从前端的一个新的模式MVVM来谈起，我们先看一个图

在这里插入图片描述

一边是视图层（view），一遍是模型层(Model)，中间的viewmodel就将两个层进行了打通，当视图上的数据发生改变时，模型层会相应得到更新。当模型层发生改变时，视图层也会相应的更新。

我们回到低代码上来，view代表低码中的页面，model代表低码中的变量管理，而数据绑定可以视作双方建立了联系，这样两边不管哪一边数据发生改变的时候都可以响应变化。

结合我们上一节定义的变量，我们在页面中添加一个文本组件

在这里插入图片描述

然后在组件上点击超链接的图标，也可以切换到数据页签进行数据绑定

在这里插入图片描述

在弹出的页面选择创建的状态变量即可

在这里插入图片描述

我们可以看到文本组件上的文本内容已经替换为变量，预览区也显示了变量的默认值

在这里插入图片描述