wxml如何注释_微信小程序-个人总结

本文介绍了微信小程序的运行环境和配置,包括全局配置如`app.json`中的页面路径、窗口表现、网络超时时间等。详细讲解了WXML的注释、数据绑定、条件渲染、列表渲染以及模板使用。此外,还涉及WXSS的尺寸单位、样式导入和选择器。最后,文章提到了WXS脚本语言的变量、事件和模块化,并分享了个人对微信小程序开发的总结。
摘要由CSDN通过智能技术生成

简介

小程序的运行环境分成渲染层和逻辑层,其中 WXML 模板和 WXSS 样式工作在渲染层,JS 脚本工作在逻辑层。这样在小程序中不能使用一些前端的框架,如jQuery、Zepto等。而网页开发者可以使用到各种浏览器暴露出来的 DOM API,进行DOM选中和操作。

25322eba73e0d50aa4502bbef4518865.png

全局配置

小程序根目录下的 app.json 文件用来对微信小程序进行全局配置,决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。

常用的配置项

属性

类型

描述

pages

string[]

页面路径列表

window

Object

全局的默认窗口表现

tabBar

Object

底部 tab 栏的表现

networkTimeout

Object

网络超时时间

debug

boolean

是否开启 debug 模式,默认关闭

部分常用配置选项

{

"pages": [ // 第一项为默认首页

"pages/index/index",

"pages/logs/index"

],

"window": {

"navigationBarBackgroundColor": "#ffffff", //导航栏背景颜色

"navigationBarTextStyle": "black",//导航栏标题颜色

"navigationBarTitleText": "微信", //导航栏标题文字内容

"backgroundColor": "#eeeeee", //窗口的背景色

"backgroundTextStyle": "light" //下拉 loading 的样式,仅支持 dark / light

},

"tabBar": {

"color": "#666",//未选中的的文字颜色

"selectedColor": "#ff8928",//选中的的文字颜色

"list": [{

"pagePath": "pages/index/index", //页面路径

"text": "首页",//tab 上按钮文字

"iconPath": "images/tabBar_img2.png", //未选中的图片路径

"selectedIconPath": "images/tabBar_img1.png"//选中时的图片路径

}, {

"pagePath": "pages/logs/logs",

"text": "日志"

}]

},

"networkTimeout": {

"request": 10000, //wx.request 的超时时间

"downloadFile": 10000 //wx.downloadFile 的超时时间

},

"debug": true,

"navigateToMiniProgramAppIdList": [ //允许跳转到其他小程序的appId

"wxe5f52902cf4de896"

]

}

复制代码

页面配置

每一个小程序页面也可以使用同名 .json 文件来对本页面的窗口表现进行配置,页面中配置项会覆盖 app.json 的 window 中相同的配置项。

{

"navigationBarBackgroundColor": "#ffffff",

"navigationBarTextStyle": "black",

"navigationBarTitleText": "微信接口功能演示",

"backgroundColor": "#eeeeee",

"backgroundTextStyle": "light"

}

复制代码

sitemap 配置

小程序根目录下的 sitemap.json 文件用来配置小程序及其页面是否允许被微信索引。

注册小程序

整个小程序只有一个 App 实例,是全部页面共享的。开发者可以通过 getApp 方法获取到全局唯一的 App 示例,获取App上的数据或调用开发者注册在 App 上的函数。

App({

onLaunch (options) { //生命周期回调——监听小程序初始化

// Do something initial when launch.

},

onShow (options) { //生命周期回调——监听小程序启动或切前台

// Do something when show.

},</

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值