微信小程序 WXML提供了import和include引用方式
使用import和include引用方式的微信小程序開發(fā)
微信小程序WXML提供了兩種文件引用方式:import
和include
,方便開發(fā)者模塊化管理代碼。
1. 使用import引用template
import
可以在當(dāng)前文件中嵌入目標(biāo)文件定義的template
,使得這個template
可以在當(dāng)前文件內(nèi)被使用。
以在item.wxml
中定義一個名為item
的template
為例:
<!-- item.wxml -->
<template name="item">
<text>{{text}}</text>
</template>
在index.wxml
中引用item.wxml
,可以使用item
模板:
<import src="item.wxml"/>
<template is="item" data="{{text: 'forbar'}}"/>
1.1 import的作用域
import
有作用域的概念。即只會import目標(biāo)文件中定義的template
,而不會import目標(biāo)文件import的template
。
例如:C import B,B import A,在C中可以使用B定義的template
,在B中可以使用A定義的template
,但是C不能使用A定義的template
。
<!--A.wxml-->
<template name="A">
<text>A template</text>
</template>
<!--B.wxml-->
<import src="a.wxml"/>
<template name="B">
<text>B template</text>
</template>
<!--C.wxml-->
<import src="b.wxml"/>
<template is="A"/> <!-- Error! Can not use tempalte when not import A. -->
<template is="B"/>
2. 使用include引用代碼片段
include
可以將目標(biāo)文件(除了<template/>
)的整個代碼引入到當(dāng)前位置。這種方式適合在多個頁面中使用相同的代碼片段,如頁面頭部和底部布局等。
header.wxml
中定義頁面頭部布局代碼片段:
<!-- header.wxml -->
<view>header</view>
同樣,在footer.wxml
中定義頁面底部布局代碼片段:
<!-- footer.wxml -->
<view>footer</view>
在index.wxml
中使用include
引入頭部和底部的代碼片段:。。。。。。
-
B2B2C多用戶商城系統(tǒng)支持企業(yè)自營與商戶入駐模式共存 會員一站式精細(xì)化營銷工具 多用戶分銷,帶來爆發(fā)式增長
系統(tǒng)支持平臺自營+供應(yīng)商店鋪共存的經(jīng)營模式(類天貓&京東模式),幫助企業(yè)打造生態(tài)級商業(yè)平臺為目的的電子商務(wù)系統(tǒng)。
免費(fèi)試用系統(tǒng) -
B2B2B電商交易系統(tǒng)優(yōu)化供應(yīng)鏈協(xié)作 授信及賬期支付 商品按照數(shù)量階梯設(shè)價
全渠道訂貨/采購及經(jīng)銷商管理數(shù)字化系統(tǒng),實(shí)現(xiàn)供應(yīng)鏈整合和交易便捷化。
免費(fèi)試用系統(tǒng) -
S2B2B電商交易系統(tǒng)供銷一體化,提高市場集中度 集團(tuán)管控一體化,有效實(shí)現(xiàn)供需匹配 移動應(yīng)用一體化,提高運(yùn)營綜合效率
上下游資源整合數(shù)字化解決方案,賦能產(chǎn)業(yè)供應(yīng)鏈,構(gòu)建產(chǎn)業(yè)互聯(lián)網(wǎng)生態(tài)體系。
免費(fèi)試用系統(tǒng)
