尘凡科技-网站建设与网络营销服务商

高端品牌建站[ 服务·品牌·影响力 ]我们赋予网站更多的价值!

全国服务热线:400-035-0716

'); })();

微信小程序开发教程之WXML模板详解

 

尘凡科技科技在前面的文章分享过微信小程序开发中的JSON配置教程,接下来跟大家分享小程序开发教程之WXML模板详解。 从事过网页编程的人知道,网页编程采用的是 HTML + CSS + JS 这样的组合,其中 HTML 是用来描述当前这个页面的结构,CSS 用来描述页面的样子,JS 通常是用来处理这个页面和用户的交互。 同样道理,在小程序开发中也有同样的角色,其中 WXML 充当的就是类似 HTML 的角色。打开 pages/index/index.wxml,你会看到以下的内容                           {{userInfo.nickName}}                {{motto}}    和 HTML 非常相似,有标签、属性等等构成。但是也有很多不一样的地方,我们来一一阐述一下   1、标签名字有点不一样 往往写 HTML 的时候,经常会用到的标签是 div, p, span,开发者在写一个页面的时候可以根据这些基础的标签组合出不一样的组件,例如日历、弹窗等等。换个思路,既然大家都需要这些组件,为什么我们不能把这些常用的组件包装起来,大大提高我们的开发效率。 从上边的例子可以看到,小程序的 WXML 用的标签是 view, button, text 等等,这些标签就是小程序给开发者包装好的基本能力,我们还提供了地图、视频、音频等等组件能力 2、多了一些 wxif 这样的属性以及 {{ }} 这样的表达式 在网页的一般开发流程中,我们通常会通过 JS 操作 DOM (对应 HTML 的描述产生的树),以引起界面的一些变化响应用户的行为。例如,用户点击某个按钮的时候,JS 会记录一些状态到 JS 变量里边,同时通过 DOM API 操控 DOM 的属性或者行为,进而引起界面一些变化。当项目越来越大的时候,你的代码会充斥着非常多的界面交互逻辑和程序的各种状态变量,显然这不是一个很好的开发模式,因此就有了 MVVM 的开发模式(例如 React, Vue),提倡把渲染和逻辑分离。简单来说就是不要再让 JS 直接操控 DOM,JS只需要管理状态即可,然后再通过一种模板语法来描述状态和界面结构的关系即可。 小程序的框架也是用到了这个思路,如果你需要把一个 Hello World 的字符串显示在界面上。 WXML 是这么写   JS 只需要管理状态即可 this.setData({ msg Hello World }) 通过 {{ }} 的语法把一个变量绑定到界面上,我们称为数据绑定。仅仅通过数据绑定还不够完整的描述状态和界面的关系,还需要 if/else, for等控制能力,在小程序里边,这些控制能力都用 wx 开头的属性来表达。 尘凡科技科技——靠谱的技术伙伴,为企业提供一站式技术服务。主要业务范围有APP开发、小程序开发、微信开发、电商系统开发、物联网(IOT)开发等互联网+领域。 小程序开发 小程序api/article291.html 微信小程序怎么用/article270.html

服务项目推荐

网站建设通过搜索引擎优化技术,提供更多的展示和推广机会,带来大量精准流量和询盘,每月意向客户增长20%。
手机网站建设手机网站的时代强势来袭,赢在全网营销时代,手机+电脑双剑合璧,把握商机滴水不漏。
微信营销集成微网站,微支付,微活动多种系统模块,通过微信公众平台迅速将您的产品和服务展现推广给海量移动端客户。
整合营销关键词2-48小时实现快速排名,覆盖6大主流搜索引擎,不让同搜索习惯的潜在客户都能找到您!

网站案例

填写您的服务需求获取项目报价

*请认真填写您的需求,我们将在24小时之内与您取得联系

7x24服务咨询
咨询电话:400-035-0716
网站安全防护
网站防攻击、植码、跳转
免费售后维护
网站永久性维护服务
一对一项目管理
制作流程无缝对接
×