基础文档地址:
https://www.w3cschool.cn/weixinapp/
本文把一些需要注意的,和一些容易忽视的问题总结起来,便于以后查阅。
详情地址:
https://www.w3cschool.cn/weixinapp/weixinapp-conditional.html
使用block wx:if
因为wx:if是一个控制属性,需要将它添加到一个标签上。但是如果我们想一次性判断多个组件标签,我们可以使用一个
view1
view2
注意:
详情地址:
https://www.w3cschool.cn/weixinapp/weixinapp-import.html
import
import可以在该文件中使用目标文件定义的template,如:
在item.wxml中定义了一个叫item的template,在index.wxml中引用了item.wxml,就可以使用item模板:
{{text}}
import有作用域的概念,即只会import目标文件中定义的template,而不会import目标文件import的template。
如:C import B,B import A,在C中可以使用B定义的template,在B中可以使用A定义的template,但是C不能使用A定义的template。
个人觉得可以用于导航、分页、页脚等场景。
关于模板定义:
https://www.w3cschool.cn/weixinapp/weixinapp-template.html
include
include可以将目标文件除了的整个代码引入,相当于是拷贝到include位置。
参考:
https://www.w3cschool.cn/weixinapp/weixinapp-nvg32czm.html
每一个 .wxs 文件和
每个模块都有自己独立的作用域。即在一个模块里面定义的变量与函数,默认为私有的,对其他模块不可见。
一个模块要想对外暴露其内部的私有变量与函数,只能通过 module.exports 实现。
exports:
通过该属性,可以对外共享本模块的私有变量与函数。
var foo = "'hello world' from tools.wxs";
var bar = function (d) {
return d;
}
module.exports = {
FOO: foo,
bar: bar,
};
module.exports.msg = "some msg";
{{tools.msg}}
{{tools.bar(tools.FOO)}}
require:
在.wxs模块中引用其他 wxs 文件模块,可以使用 require 函数。
引用的时候,要注意如下几点:
只能引用 .wxs 文件模块,且必须使用相对路径。
wxs 模块均为单例,wxs 模块在第一次被引用时,会自动初始化为单例对象。多个页面,多个地方,多次引用,使用的都是同一个 wxs 模块对象。
如果一个 wxs 模块在定义之后,一直没有被引用,则该模块不会被解析与运行。
// /pages/tools.wxs
var foo = "'hello world' from tools.wxs";
var bar = function (d) {
return d;
}
module.exports = {
FOO: foo,
bar: bar,
};
module.exports.msg = "some msg";
// /pages/logic.wxs
var tools = require("./tools.wxs");
console.log(tools.FOO);
console.log(tools.bar("logic.wxs"));
console.log(tools.msg);
可结合起来,用于公用方法,公用常量等。