微信小程序 教程之引用
系列文章:
微信小程序 教程之WXSS
微信小程序 教程之引用
微信小程序 教程之事件
微信小程序 教程之模板
微信小程序 教程之列表渲染
微信小程序 教程之條件渲染
微信小程序 教程之?dāng)?shù)據(jù)綁定
微信小程序 教程之WXML
引用
WXML提供兩種文件引用方式import和include。
import
import可以在該文件中使用目標(biāo)文件定義的template,如:
在item.wxml中定義了一個(gè)叫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'}}"/>
import的作用域
import有作用域的概念,即只會(huì)import目標(biāo)文件中定義的template,而不會(huì)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"/>
include
include可以將目標(biāo)文件出了<template/>的整個(gè)代碼引入,相當(dāng)于是拷貝到include位置,如:
<!-- index.wxml --> <include src="header.wxml"/> <view> body </view> <include src="footer.wxml"/>
<!-- header.wxml --> <view> header </view>
<!-- footer.wxml --> <view> footer </view>
感謝閱讀,希望能幫助到大家,謝謝大家對(duì)本站的支持!
- 微信小程序 條件渲染詳解
- 微信小程序 教程之條件渲染
- 微信小程序教程系列之視圖層的條件渲染(10)
- 微信小程序利用button控制條件標(biāo)簽的變量問(wèn)題
- 微信小程序?qū)W習(xí)總結(jié)(二)樣式、屬性、模板操作分析
- 微信小程序?qū)W習(xí)總結(jié)(一)項(xiàng)目創(chuàng)建與目錄結(jié)構(gòu)分析
- 微信小程序 引用其他js文件實(shí)現(xiàn)代碼
- 詳解微信小程序入門(mén)五: wxml文件引用、模版、生命周期
- 微信小程序如何引用外部js,外部樣式,公共頁(yè)面模板
- 微信小程序視圖template模板引用的實(shí)例詳解
- 微信小程序引用公共js里的方法的實(shí)例詳解
- 微信小程序?qū)W習(xí)總結(jié)(三)條件、模板、文件引用實(shí)例分析
相關(guān)文章
async-validator實(shí)現(xiàn)原理源碼解析
這篇文章主要為大家介紹了async-validator實(shí)現(xiàn)原理源碼解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-01-01You-Dont-Know-JS作用域?qū)W習(xí)文檔
這篇文章主要介紹了You-Dont-Know-JS作用域?qū)W習(xí)文檔,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-08-08微信小程序 swiper制作tab切換實(shí)現(xiàn)附源碼
這篇文章主要介紹了微信小程序 swiper制作tab切換實(shí)現(xiàn)代碼的相關(guān)資料,需要的朋友可以參考下2017-01-01JavaScript獲取上傳文件相關(guān)信息示例詳解
這篇文章主要為大家介紹了JavaScript獲取上傳文件相關(guān)信息示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-08-08Web項(xiàng)目如何配置Eslint過(guò)程詳解
這篇文章主要為大家介紹了Web項(xiàng)目如何配置Eslint過(guò)程詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-09-09微信小程序 實(shí)現(xiàn)動(dòng)態(tài)顯示和隱藏某個(gè)控件
這篇文章主要介紹了微信小程序 實(shí)現(xiàn)動(dòng)態(tài)顯示和隱藏某個(gè)控件的相關(guān)資料,需要的朋友可以參考下2017-04-04