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

2021-12-17 09:04:08 浏览数 (1)

目录

01 总体介绍

02 应用介绍

03 页面介绍

04 hello,world

05 变量定义

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

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

在这里插入图片描述在这里插入图片描述

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

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

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

在这里插入图片描述在这里插入图片描述

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

在这里插入图片描述在这里插入图片描述

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

在这里插入图片描述在这里插入图片描述

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

在这里插入图片描述在这里插入图片描述

0 人点赞