开始

介绍

SJS 是小程序一套自定义脚本语言，可以在 DLT 中使用其辅助构建页面结构。

SJS 代码可以编写在 dlt 文件中的<import-sjs>标签内，或以 sjs 为后缀名的文件内，然后在 DLT 模板中进行引用。

SJS 自小程序基础库版本 1.0.0 开始支持。

模块

每一个 sjs 文件和<import-sjs>标签都是一个单独的模块。

每个模块都有自己独立的作用域。即在一个模块里面定义的变量与函数，默认为私有的，对其他模块不可见。

使用方式

sjs 文件

在小程序项目中创建以 sjs 为后缀的文件，然后可以在其中编写 sjs 脚本。

下述例子在/pages/utils.sjs 的文件里面编写了 sjs 代码。该.sjs 文件可以被其他的.sjs 文件 或 DLT 中的 <import-sjs> 标签引用。

代码示例

• 编写 SJS 逻辑

// pages/utils.sjs 中编写 SJS 逻辑

const bar = function (name) {
  return " dlt-" + name;
};

export default {
  bar: bar,
};

• 引用并调用 SJS

<!-- 在 pages/index/index 页面中 -->

<!-- 引用SJS -->
<import-sjs src="../utils.sjs" module="utils" />

<!-- 使用SJS -->

<view class="container">{{utils.bar(name)}}</view>

• 页面显示结果

dlt-sjs

import-sjs 标签

import-sjs 标签有两个作用，一个是通过 src 属性引用其它 sjs 模块，此时标签可以为自闭和标签；另一个是使用其容纳 sjs 代码。

1.引用 sjs 文件

相关属性

属性名	类型	必填	说明
module	String	是	当前<import-sjs>标签的模块名。必填字段。
src	String	否	引用.sjs 文件的路径，仅当本标签为单闭合标签或标签的内容为空时有效； 如果当做 sjs 代码容器标签，则不必填写。

module 属性

module 属性是当前<import-sjs>标签的模块名。在单个 dlt 文件内，建议其值唯一。有重复模块名则按照先后顺序覆盖（后者覆盖前者）。不同文件之间的 sjs 模块名不会相互覆盖。

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

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

src 属性

src 属性可以用来引用其他的 sjs 文件模块。

引用的时候，要注意如下几点：

• 只能引用.sjs 文件模块。

• sjs 模块均为单例，sjs 模块在第一次被引用时，会自动初始化为单例对象。多个页面，多个地方，多次引用，使用的都是同一个 sjs 模块对象。

• 如果一个 sjs 模块在定义之后，一直没有被引用，则该模块不会被解析与运行。

  2.作为 SJS 代码容器

import-sjs 标签除了引用其它 sjs 模块，还可直接作为 SJS 代码的容器，使用 module 制定该模块名称，用法与上等同。

代码示例

• 在 DLT 模板中定义并使用 SJS

<!-- 定义SJS -->
<import-sjs module="utils">
  const bar = function(name) { return ' dlt-' + name; } export default { bar:
  bar };
</import-sjs>

<!-- 使用SJS -->

<view class="container">{{utils.bar(name)}}</view>

• 页面显示结果

dlt-sjs

注意

• sjs 文件命名方式为：模块名 . sjs ；
• sjs 通过 export default 方式对外暴露其内部的私有函数；
• sjs 只能导出 function 函数；
• sjs 函数不能作为组件的事件回调；
• sjs 可以创建独立得模块，也可以通过内联的形式；
• sjs 不支持全局变量；
• 多个 import-sjs 标签不能出现相同的 src 属性值， module 属性的值也是标识模块的唯一 id 。