WXS 模块
官方文档地址:https://developers.weixin.qq.com/miniprogram/dev/reference/wxs/01wxs-module.html
知识点1、
官方文档中有 提到:
每一个 .wxs
文件和 <wxs>
标签都是一个单独的模块。
每个模块都有自己独立的作用域。即在一个模块里面定义的变量与函数,默认为私有的,对其他模块不可见。
一个模块要想对外暴露其内部的私有变量与函数,只能通过 module.exports
实现。
举例:index.wxs文件写法
var wxsText = "我是来源自wxs的文本"; var wxsFunction = function (d) { console.log("我是来源自wxs的方法") } module.exports = {//对外暴露 wxsShowText: wxsText, wxsShowFunction: wxsFunction }; module.exports.wxsShowMsg = "缩减写法";//对外暴露
对应的 wxml.wxml 文件
<view> 页面index </view> <!-- 下面是调用.wxs --> <wxs src="../wxs.wxs" module="anWxs"></wxs> <view>{{anWxs.wxsShowText}}</view> <view>{{anWxs.wxsShowFunction("请看控制台Console")}}</view> <view>{{anWxs.wxsShowMsg}}</view>
结果:
注:个人感觉这更适合编写一些自己在使用的小工具。如时间戳转时间格式等
知识点2、
require函数 在.wxs模块中引用其他 wxs 文件模块,可以使用 require 函数。
em……这里遇到问题了…
知识点3、
在wxml中也可以编写wxs代码,但是要注意wxs的src属性(仅当本标签为单闭合标签或标签的内容为空时有效。)
示例:
<!-- 定义 --> <wxs module="newWxs"> var thisText = "hello world"; module.exports = { showText : thisText, } </wxs> <!-- 取值 --> <view> {{newWxs.showText}} </view>