7、微信小程序免费视频教程之模块化

视频内容

微信小程序的视图层其实就是项目当中所有的wxml以及xwss文件的集合。

wxml文件用于描述页面的结构。

wxss文件用于描述页面的样式。

微信小程序的逻辑层负责将数据进行处理,然后发送给视图层来进行展示。

视图层的主要作用就是将数据进行展示。将得到的事件反馈给逻辑层。

view ----div

text-----span

作为一种组件。可以这种组件称为视图容器组件。

1、数据绑定。

wxml文件内的所有数据都来自js文件当中Page的data对象。

数据绑定需要作用双大括号来对变量进行包裹!

<text>{{content}}</text>

data: {

content:"我是一只小小小小小小鸟"

},

还可以通过数据绑定来设置组件的属性.(设置属性也需要使用双大括号)

<text id="item-{{id}}"">{{content}}</text>

data: {

content:"我是一只小小小小小小鸟",

id:888

},

另外还可以通过{{}}来实现

三元运算

算术运算

字符串的拼接

2、条件语句

通过条件语句来对.wxml中的内容进行渲染。 根据条件的不同来显示不同的内容。

wx:if:通过用wx:if="{{}}"来判断是否需要渲染该代码块。

还可以使用wx:elif和wx:else

block仅仅是一个包裹元素而已,不属性于小程序的组件,也不会在页面当中进行任何的渲染。可以通过该标签来实现一些属性上的控制。

原文发布于微信公众号 - 张培跃(zhangpeiyue8)

原文发表时间:2018-02-10

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

扫码关注云+社区

领取腾讯云代金券