微信小程序外部引入方法

一、引入模板
小程序提供了兩個(gè)引入外部模板的方法：import和include
使用外部模板可以實(shí)現(xiàn)大部分共同頁(yè)面的代碼利用，在一個(gè)app中，頭部和腳部基本不會(huì)
變動(dòng)太大，這時(shí)就可以通過模板的方式引入，實(shí)現(xiàn)多個(gè)頁(yè)面的復(fù)用。

1.1 import

示例：

<!--view.wxml-->

<template name="view">

<text>{{text}}</text>

</template>

引入：

<import src="view.wxml"/>

<template is="view" data="{{text: 'forbar'}}"/>

注意：import有作用域，即import引入的模板只在當(dāng)前頁(yè)面有效，即import不會(huì)向下查找另外的模板

1.2 include

include標(biāo)簽可以看作是對(duì) “html”的一個(gè)拷貝，即將外部的wxml片段拷貝進(jìn)文檔中
示例：
外部wxml片段

<!-- header.wxml -->

<view> header </view>

<!-- footer.wxml -->

<view> footer </view>

<!-- index.wxml -->

<include src="header.wxml"/>

<view> body </view>

總結(jié)：import是引入模板片段，且有作用域限制，不能進(jìn)行模板嵌套。include是引入wxml片段，相當(dāng)于代碼拷貝。

二、WXSS 微信樣式表
小程序中，頁(yè)面樣式的渲染通過wxss文件實(shí)現(xiàn)，.wxss可以看成是css，因?yàn)樗鼈兌荚趯?shí)現(xiàn)相同的功能。實(shí)質(zhì)上wxss也是在css的基礎(chǔ)之上進(jìn)行了擴(kuò)充和修改得到的。
wxss在css上的擴(kuò)展特性：
1）、尺寸單位：rpx
rpx：是一個(gè)相對(duì)像素單位，可以根據(jù)屏幕寬度進(jìn)行自適應(yīng)。
針對(duì)移動(dòng)端的開發(fā)，設(shè)計(jì)稿一般都是以iphone6為標(biāo)準(zhǔn)的。而iphone用的是視網(wǎng)膜屏，即我們css中設(shè)定的1px，在iphone上實(shí)際是由2px*2px的像素點(diǎn)組成的。
以iphone6為準(zhǔn)，屏幕寬度375px，共有750個(gè)物理像素，則750rpx=350px,即1rpx=0.5px
2）、樣式導(dǎo)入 @import
跟在css中的外部樣式表的導(dǎo)入類似
@import "common.wxss";

分享名稱：微信小程序外部引入方法
鏈接地址：http://www.bm7419.com/news38/215288.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián)，是專注品牌與效果的網(wǎng)站制作，網(wǎng)絡(luò)營(yíng)銷seo公司；服務(wù)項(xiàng)目有微信小程序等

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)