「小程式JAVA實戰」小程式模組頁面引用（18）

原創文章，歡迎轉載。轉載請註明：轉載自IT人故事會，謝謝！
原文連結地址：「小程式JAVA實戰」小程式模組頁面引用（18）

上一節，講了模板的概念，其實小程式還提供了模組的概念。原始碼：https://github.com/limingios/wxProgram.git 中的No.8

小程式的WXS模組

1. js程式碼塊可以在頁面中被引入使用
2. 定義*.wxs,module.exports暴露介面和屬性

從私有到公用的概念，通過暴露就可以公有話。

3. <wxs src = "" module = ""/>
4. 官方的闡述

https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxs/01wxs-module.html

5. 演示模組的概念

每一個 .wxs 檔案和 <wxs> 標籤都是一個單獨的模組。每個模組都有自己獨立的作用域。即在一個模組裡面定義的變數與函式，預設為私有的，對其他模組不可見。一個模組要想對外暴露其內部的私有變數與函式，只能通過 module.exports 實現。

<!wxs.wxml-->
<view class="container">
  <wxs src="../wxs/module.wxs" module="item"></wxs>
  <view>{{item.name}}</view>
  <view>{{item.age}}</view>
  <view>{{item.method("這是一個引數傳遞")}}</view>

  <view>{{item.name}}</view>
  <view>{{item.age}}</view>
  <view>{{item.method("這是一個引數傳遞")}}</view>

  <view>{{item.name}}</view>
  <view>{{item.age}}</view>
  <view>{{item.method("這是一個引數傳遞")}}</view>
</view>

// module.wxs
var name ="公眾號：程式設計坑太多"
var age = 18;

var method = function(obj){
  return obj;
}

module.exports ={
  name :name,
  age : age,
  method :method
}

PS : 通過src進行匯入，然後在引入module引數進行呼叫裡面的屬性和介面方法。