数据绑定

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

小程序页面上要用的数据应该在它的 data 里面 .. 在注册页面用的 Page 函数里面,可以添加一个 data ... 里面可以包含页面需要的数据 .. 比如这里我们先添加一个 header ... 它的值是个对象 .. 里面再添加一个 content 属性 ... 它的值可以是 views ..

在页面的视图文件里,我们可以绑定输出页面的 data 里的数据 .. 比如在这个 text 组件里面,先去掉这个静态的文字 .. 然后在这里绑定一个动态的数据 .. 两组花括号 .. 在它里面可以做一些运算 . 这里我们绑定一个 header.content ..

在页面上会显示一个 views .. 这个数据来自页面的 data 对象 ..

这种绑定也可以用在组件的属性上面 .. 在 header 里面添加一个 class .. 对应的值是 header .. 然后去掉 text 组件上的 class 属性里的值 .. 在双引号的里面,再添加两组花括号 .. 绑定一个 header.class ..

现在这个页面视图上显示的文字还有它上面应用的类,都是来自页面的初始化数据 .. 这样你在小程序里面可以动态的去设置这些数据 ..

回到开发者工具 .. 在调试这里,打开 AppData 这个面板 .. 这里显示的就是当前页面上的数据 ..

你会看到这里有个 header ,它里面有个 content .. 还有个 class ..

在绑定数据用的花括号里面,我们还可以做一些运算 ..

比如在这个标题内容的前面,添加一个字符串 ... 加上一个标题前缀 ..

还可以这样 ... 判断一下 header.content .. 看看它里面有没有东西 .. 如果有,就显示一个 header.content ... 如果 header 里的 content 里面没有内容 .. 就显示一个 无标题 ..

现在页面上会显示一个 views .. 再去掉 header 里的 content ... 这样页面上就会显示一个 无标题 ...

0:00
0:00
2:23
0:00
3:54
0:00
1:46

数据绑定《 微信小程序:视图 》

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点