Shulou(Shulou.com)06/02 Report--

This article "WeChat Mini Programs WXS module how to use" in addition to programmers, most people do not understand, today, in order to make you better understand the "WeChat Mini Programs WXS module how to use", summed up the following content, with a certain reference value, the detailed steps are clear, the details are handled properly, I hope you can get something through this article, let's take a look at the specific content.

WXS module

WXS code can be written in tags in wxml files, or in files with the suffix .wxs.

Module

Each .wxs file and tag is a separate module.

Each module has its own independent scope. That is, variables and functions defined in one module are private by default and are not visible to other modules.

If a module wants to expose its internal private variables and functions, it can only be implemented through module.exports.

.wxs file

In the Wechat developer tool, right-click to create a .wxs file and write WXS scripts directly in it.

Sample code:

/ pages/comm.wxs

Var foo = "'hello world' from comm.wxs"

Var bar = function (d) {

Return d

}

Module.exports = {

Foo: foo

Bar: bar

}

The above example writes WXS code in the / pages/comm.wxs file. The .wxs file can be referenced by tags in other .wxs files or in WXML.

Module object

Each wxs module has a built-in module object.

Attribute

Exports: through this attribute, you can share private variables and functions of this module.

Sample code:

/ 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"

{{tools.msg}}

{{tools.bar (tools.FOO)}}

Page output:

Some msg

'hello world' from tools.wxs

Require function

To reference other wxs file modules in the .wxs module, you can use the require function.

When quoting, pay attention to the following points:

Only .wxs file modules can be referenced, and relative paths must be used.

Wxs modules are singletons, and wxs modules are automatically initialized to singleton objects when they are referenced for the first time. Multiple pages, multiple places, multiple references, using the same wxs module object.

If a wxs module has not been referenced since it has been defined, the module will not be parsed and run.

Sample code:

/ 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)

Console output:

'hello world' from tools.wxs

Logic.wxs

Some msg

Label

The default value of the attribute name type indicates the module name of the current label of moduleString. Required fields. SrcString references the relative path of the .wxs file. Valid only if this tag is a single closed tag or the content of the tag is empty.

Module attribute

The module attribute is the module name of the current tag. Within a single wxml file, it is recommended that its value be unique. Duplicate module names are overwritten in order (the latter overrides the former). Wxs module names between different files do not overwrite each other.

The naming of the module attribute value must conform to the following two rules:

The first character must be: letter (a-zA-Z), underscore (_)

The remaining characters can be: letters (a-zA-Z), underscores (_), numbers (0-9)

Sample code:

Var some_msg = "hello world"

Module.exports = {

Msg: some_msg

}

{{foo.msg}}

Page output:

Hello world

The above example declares a module named foo that exposes the some_msg variable for use on the current page.

Src attribute

The src attribute can be used to reference other wxs file modules.

When quoting, pay attention to the following points:

Only .wxs file modules can be referenced, and relative paths must be used.

Wxs modules are singletons, and wxs modules are automatically initialized to singleton objects when they are referenced for the first time. Multiple pages, multiple places, multiple references, using the same wxs module object.

If a wxs module has not been referenced since it has been defined, the module will not be parsed and run.

Sample code:

/ pages/index/index.js

Page ({

Data: {

Msg: "'hello wrold' from js"

}

})

{{some_comms.bar (some_comms.foo)}}

{{some_comms.bar (msg)}}

Page output:

'hello world' from comm.wxs

'hello wrold' from js

The above example references the / page/comm.wxs module through tags in the file / page/index/index.wxml.

Be careful

The module can only be accessed in the WXML file that defines the module. When using or, the module will not be introduced into the corresponding WXML file.

Tag, you can only use the modules defined in the WXML file that defines it.

What does Mini Program mean? Mini Program is an application that can be used without download and installation. It can be used immediately by scanning a QR code or searching it. It is easy to operate and easy to spread. It can achieve seven major functions, such as message notification, offline code scanning, official account association, and so on. It is based on Wechat, similar to APP. You can use it whenever you want. After using it, you will leave without taking up memory.

Thank you for your reading. I hope you have a certain understanding of the key issue of "how to use the WeChat Mini Programs WXS module". The specific use still needs to be understood by everyone through hands-on experiments. Try it quickly. If you want to read more articles about relevant knowledge points, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.