[TOC] # 1.模板數據導出引入 ## 1.全局數據的調用 例：現有一個數據local.js（data/local.js）,想在其他頁面index（"pages/index/index"）里調用里面的數據，那么你可以這樣做 **1.將local.js里想要傳遞的內容整體裝在一個數組里（數組名自定義即可）** ~~~ var local_database = [ { date:"2017", title:"title1" }， { date:"2018", title:"title2" } ] module.exports = { /* 自定義數組名postLIst */ postList: local_database } ~~~ **2.在index.js接收數據postList** ~~~ /* 頁面間導入pages外的頁面只能用相對路徑 */ var local = require("../../data/local"); var postList = local.postList; ~~~ ## 2.調用別的頁面里方法 例：現有一個數據local.js（data/local.js）,想在其他頁面index（"pages/index/index"）里調用里面的方法，那么你可以這樣做 **1.在local.js寫你的方法** ~~~ function a(){conosle.log("you are beautiful")} function b(){console.log("how beautiful you are")} /* 默認導出方法 */ export default { a, b } ~~~ **2.在index（"pages/index/index"）里調用方法** ~~~ /* 頁面間導入pages外的頁面只能用相對路徑 */ import local from "../../data/local"; const fa= local.a; const fb= local.b; fa(); fb(); ~~~ # 2.頁面跳轉時參數傳遞 **在頁面跳轉到另一個頁面時可以傳遞參數，你可以這樣寫** 例：在index（"pages/index/index"）頁面點擊button（bindtap="click"），跳轉到另一個頁面welcome（"pages/welcome/welcome"），并傳遞三個參數type、title和name（**在傳遞三個及三個以上的參數時都用'&'連接符連接**） * 在index.js里這樣寫 ~~~ Page({ data: { id:10, title: "you are beautiful", name: "xiaopi" }, click(){ var id = this.data.id; var title = this.data.title; var name = this.data.name; wx.navigateTo({ url: '/pages/welcome/welcome?id='+id+"&count="+count+"&name="+name }) } }) ~~~ **在welcome里接收這兩個屬性** * 在welcome.js里這樣寫 ~~~ Page({ onLoad(option){ var title = option.title; var id = option.id; var name = option.name; /* 在控制臺查看是否傳入成功 */ console.log(title); console.log(id); console.log(name); } }) ~~~ # 3.代碼段傳遞 ## 1.在小程序里面一般會將一段復寫度比較高的代碼寫成模板。方便進項復寫 例： 1.創建模板文件夾（"template"）存放模板inside("template/template-inside/template-inside") **一般模板只需要寫.index和.wxss兩個內容** ~~~ <!-- template-inside.wxml --> <template name="templateInside"> <p class="tein">hello</p> </template> ~~~ ~~~ /* template-inside.wxss */ .tein{ color: aqua; } ~~~ 2.在index頁面（"pages/index/index"）調用模板inside,調用頁面的同時要引入.wxss文件內容 ~~~ <!-- index.wxml --> <import src="/template/template-inside/template-inside"></import> <view>hello world</view> <template is="templateInside"></template> ~~~ ~~~ @import "/template/template-inside/template-inside.wxss"; ~~~ ## 2.關于模板頁傳參問題 在使用模板時可以給模板頁傳遞當前需使用模板頁面的data內容 例如： 在上例中我們在index.js下data里存放了一個對象postList ~~~ /* index.js */ Page({ data:({ postList:{ msg:"where are you" } }) }) ~~~ 想在模板頁使用到msg，那么你需要這樣做 ~~~ <!--index.wxml--> <import src="/template/template-inside/template-inside"></import> <view>hello world</view> <template is="templateInside" data="{{...postList}}"></template> ~~~ 接下來就可以直接在模板頁使用msg參數了 ~~~ <!-- template-inside --> <template name="templateInside"> <p class="tein">hello</p> <view>{{msg}}</view> </template> ~~~