使用 對**進行模板定義,並使用name屬性為模板進行命名,如:
}: }
time: }
6
<template
name="msgitem"
>
<view
>
<text
> }: }
text
>
<text
> time: }
text
>
view>
template而在需要使用模板的地方,首先需要引用模板檔案,通過import關鍵字,可以在檔案中使用引用檔案中定義的template,如:>
1
<而使用的話,同樣是 ,但使用其is 屬性進行宣告使用,並將模板需要的資料傳入。如:import
src="item.wxml"
/>
<import
src="item.wxml"
/>
<來實際操作一下,我們接著之前的章節,現在把welcome頁面中的**片段 welcome,}!} 抽離為模板:template
is="msgitem"
data="}"
/>
然後,我們到welcome.wxml中引用name為welcome的模板:
注:這裡的 ... 是wxml中提供的乙個擴充套件運算子,表示將乙個物件展開,這樣一來在模板中本需要使用pagedata.nickname的形式,現在只需要寫nickname即可。
可以看到,這裡傳入的資料引數名為pagedata,那麼我們在welcome.js中的data也需要修改為json物件的形式:
我們看到效果和之前直接寫是一樣的:
值得注意的是,因為**執行順序的緣故,盡量把module.exports放在檔案的最後。自己踩過的乙個坑就是,曾把它放在第一行,結果引出的變數為undefined。
之前我們的變數nickname是寫在welcome.js中的,現在我們把它抽離到其他js檔案中,來示範一下「模組化」。
首先建立乙個根目錄命名為「modules」,在其下新建乙個js檔案data.js:
在js中可以定義變數或者函式,我們簡單寫一下,然後使用 module.exports 來暴露介面以供外界呼叫:
原來在welcome.js的onload函式中,我們的nickname是直接賦值的字串,現在我們要引用模組檔案data.js中的nickname,或者getnickname:
編譯一下檢視效果,妥妥的:
微信小程式(模組化)
1.模組化 我們可以將一些公共的 抽離成為乙個單獨的 js 檔案,作為乙個模組。模組只有通過 module.exports 或者 exports 才能對外暴露介面。需要注意的是 exports 是 module.exports 的乙個引用,因此在模組裡邊隨意更改 exports 的指向會造成未知的錯...
微信小程式 模組化
wxml js wxss三類都可以模組化!一 js類 可以將一些公共的 抽離成為乙個單獨的 js 檔案,作為乙個模組。模組只有通過module.exports或者exports才能對外暴露介面。tip 首先先要了解一點,每個js裡定義的變數 函式,只在當前的檔案裡有效,也就是說每個js檔案的作用域只...
微信小程式 模組化
顧名思義,就是將一段 模組化,等我要用的時候直接呼叫就好了,就好像咱們oc裡的自定義控制項一樣,用的時候直接上就好了。因為有網路請求,所以就想著自己寫個像oc那樣子的 哦上 吧,首先得建乙個js檔案,位置隨意放,我是放在了乙個資料夾裡 然後就是裡面定義的 了像醬 網路請求 function http...