<wxs>
tags in a wxml file or in files with the extension .wxs..wxs
file or <wxs>
tag is an independent module.module.exports
implementation..wxs
file. You can write WXS scripts directly in the file.// /pages/comm.wxsvar foo = "'hello world' from comm.wxs";var bar = function(d) {return d;}module.exports = {foo: foo,bar: bar};
wxs
module contains one built-in module
object.// /pages/tools.wxsvar foo = "'hello world' from tools.wxs";var bar = function (d) {return d;}module.exports = {FOO: foo,bar: bar,};module.exports.msg = "some msg";
<!-- page/index/index.wxml --><wxs src="./../tools.wxs" module="tools" /><view> {{tools.msg}} </view><view> {{tools.bar(tools.FOO)}} </view>
some msg'hello world' from tools.wxs
require
function to reference another wxs
file module in a .wxs
module.wxs
file module, you must note the following:.wxs
files modules and must use relative paths;wxs
modules are single instances. The first time a wxs module is referenced, it is automatically initialized as a single-instance object. Multiple pages, multiple regions, and multiple references all use the same wxs module object;// /pages/tools.wxsvar 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.wxsvar tools = require("./tools.wxs");console.log(tools.FOO);console.log(tools.bar("logic.wxs"));console.log(tools.msg);
<!-- /page/index/index.wxml --><wxs src="./../logic.wxs" module="logic" />
'hello world' from tools.wxslogic.wxssome msg
Property Name | Type | Default Value | Description |
module | String | - | The module name of the current <wxs> tag. This is a required field. |
src | String | - | The relative path of the referenced .wxs file, only valid when this tag is a single closed tag or the tag content is empty. |
<wxs>
tag. In a single wxml file, we recommend that this value be unique. In the case of duplicate module names, the value is overwritten based on the order (the latter overwrites the former). The names of wxs modules are not overwritten across different files.<!--wxml--><wxs module="foo">var some_msg = "hello world";module.exports = {msg : some_msg,}</wxs><view> {{foo.msg}} </view>
hello world
// /pages/index/index.jsPage({data: {msg: "'hello wrold' from js",}})
<!-- /pages/index/index.wxml --><wxs src="./../comm.wxs" module="some_comms"></wxs><!-- You can also directly use single tag closed syntax.<wxs src="./../comm.wxs" module="some_comms" />--><!-- Calls the bar function in the some_comms module, and the parameter is foo in the some_comms module. --><view> {{some_comms.bar(some_comms.foo)}} </view><!-- Calls the bar function in the some_comms module, and the parameter is msg in page/index/index.js. --><view> {{some_comms.bar(msg)}} </view>
'hello world' from comm.wxs'hello wrold' from js
<wxs>
module can only be accessed in the WXML file that defines the module. If you use <include>
or <import>
, <wxs>
modules are not introduced into the corresponding WXML files.<template>
tag, you can only use the <wxs>
module defined in the WXML file that defines the <template>
.
Was this page helpful?