WXS 模浚？？

WXS 代码可以编写在 wxml 文件中的 <wxs> 标签内，，，或以 .wxs 为后缀名的文件内。。。
。

模浚？？

每一个 .wxs 文件和 <wxs> 标签都是一个单独的模浚？？。。。
。

每个模浚？？槎加凶约鹤粤Φ淖饔糜。。。
。即在一个模浚？？槟诶锝缢档谋淞坑牒，，默以为私有的，，，对其他模浚？？椴豢杉。。。
。

一个模浚？？橐攵酝馓宦镀淠诓康乃接斜淞坑牒，，只能通过 module.exports 实现。。。
。

.wxs 文件

在微信开发者工具内里，，，右键可以直接建设 .wxs 文件，，，在其中直接编写 WXS 剧本。。。
。

示例代码：

// /pages/comm.wxs

var foo = "'hello world' from comm.wxs";
var bar = function(d) {
  return d;
}
module.exports = {
  foo: foo,
  bar: bar
};

上述例子在 /pages/comm.wxs 的文件内里编写了 WXS 代码。。。
。该 .wxs 文件可以被其他的 .wxs 文件 或 WXML 中的 <wxs> 标签引用。。。
。

module 工具

每个 wxs 模浚？？榫幸桓瞿谥玫 module 工具。。。
。

属性

• exports: 通过该属性，，，可以对外共享本模浚？？榈乃接斜淞坑牒。。。
  。

示例代码：

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

<!-- 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 函数

在.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);

<!-- /page/index/index.wxml -->

<wxs src="./../logic.wxs" module="logic" />

控制台输出：

'hello world' from tools.wxs
logic.wxs
some msg

<wxs> 标签

module 属性

module 属性是目今 <wxs> 标签的模浚？？槊。。。
。在单个 wxml 文件内，，，建议其值唯一。。。
。有重复模浚？？槊蚱局は群笏承蛄郑ê笳吡智罢撸。。。
。差别文件之间的 wxs 模浚？？槊换嵯嗷チ。。。
。

module 属性值的命名必需切合下面两个规则：

• 首字符必需是：字母（a-zA-Z），，，下划线（_）
• 剩余字符可以是：字母（a-zA-Z），，，下划线（_），，， 数字（0-9）

示例代码：

<!--wxml-->

<wxs module="foo">
var some_msg = "hello world";
module.exports = {
    msg : some_msg,
}
</wxs>
<view> {{foo.msg}} </view>

页面输出：

hello world

上面例子声明晰一个名字为 foo 的模浚？？椋，，将 some_msg 变量袒露出来，，，供目今页面使用。。。
。

src 属性

src 属性可以用来引用其他的 wxs 文件模浚？？。。。
。

引用的时间，，，要注重如下几点：

• 只能引用 .wxs 文件模浚？？椋，，且必需使用相对路径。。。
  。
• wxs 模浚？？榫ダ，，wxs 模浚？？樵诘谝淮伪灰檬保，，会自动初始化为单例工具。。。
  。多个页面，，，多个地方，，，多次引用，，，使用的都是统一个 wxs 模浚？？楣ぞ。。。
  。
• 若是一个 wxs 模浚？？樵诮缢抵螅，，一直没有被引用，，，则该模浚？？椴换岜黄饰鲇朐诵。。。
  。

示例代码：

// /pages/index/index.js

Page({
  data: {
    msg: "'hello wrold' from js",
  }
})

<!-- /pages/index/index.wxml -->

<wxs src="./../comm.wxs" module="some_comms"></wxs>
<!-- 也可以直接使用单标签闭合的写法
<wxs src="./../comm.wxs" module="some_comms" />
-->

<!-- 挪用 some_comms 模浚？？槟诶锏 bar 函数，，，且参数为 some_comms 模浚？？槟诶锏 foo -->
<view> {{some_comms.bar(some_comms.foo)}} </view>
<!-- 挪用 some_comms 模浚？？槟诶锏 bar 函数，，，且参数为 page/index/index.js 内里的 msg -->
<view> {{some_comms.bar(msg)}} </view>

页面输出：

'hello world' from comm.wxs
'hello wrold' from js

上述例子在文件 /page/index/index.wxml 中通过 <wxs> 标签引用了 /page/comm.wxs 模浚？？。。。
。

注重

• <wxs> 模浚？？橹荒茉诮缢的？？？？榈 WXML 文件中被会见到。。。
  。使用 <include> 或 <import> 时，，，<wxs> 模浚？？椴换岜灰氲蕉杂Φ WXML 文件中。。。
  。
• <template> 标签中，，，只能使用界说该 <template> 的 WXML 文件中界说的 <wxs> 模浚？？。。。
  。