小程序代碼的構(gòu)成 - WXML 模板
什么是 WXML ?
簡單說明 :WXML(WeiXin Markup Language)是小程序框架設(shè)計的一套標簽語言,用來構(gòu)建小程序頁面的結(jié)構(gòu),其作用類似于網(wǎng)頁開發(fā)中的 HTML。
WXML 和 HTML 的區(qū)別
① 標簽名稱不同:
HTML (div, span, img, a)
WXML(view, text, image, navigator)
② 屬性節(jié)點不同:
③ 提供了類似于 Vue 中的模板語法
數(shù)據(jù)綁定
列表渲染
條件渲染
小程序代碼的構(gòu)成 - WXSS 樣式
什么是 WXSS ?
簡單說明 :WXSS (WeiXin Style Sheets)是一套樣式語言,用于描述 WXML 的組件樣式,類似于網(wǎng)頁開發(fā)中的 CSS
WXSS 和 CSS 的區(qū)別
① 新增了 rpx 尺寸單位
CSS 中需要手動進行像素單位換算,例如 rem
WXSS 在底層支持新的尺寸單位 rpx,在不同大小的屏幕上小程序會自動進行換算
② 提供了全局的樣式和局部樣式
項目根目錄中的 app.wxss 會作用于所有小程序頁面
局部頁面的 .wxss 樣式僅對當前頁面生效
③ WXSS 僅支持部分 CSS 選擇器
class 和 #id
element
并集選擇器、后代選擇器
::after 和 ::before 等偽類選擇器
小程序代碼的構(gòu)成 - JS 邏輯交互
小程序中的 .js 文件
一個項目僅僅提供界面展示是不夠的,在小程序中,我們通過 .js 文件來處理用戶的操作。例如:響應(yīng)用戶的點擊、獲取用戶的位置等等。
小程序中 .js 文件的分類
小程序中的 JS 文件分為三大類,分別是:
① app.js ??? 是整個小程序項目的入口文件,通過調(diào)用 App() 函數(shù)來啟動整個小程序
② 頁面的 .js 文件 ??? 是頁面的入口文件,通過調(diào)用 Page() 函數(shù)來創(chuàng)建并運行頁面
③ 普通的 .js 文件 ??? 是普通的功能模塊文件,用來封裝公共的函數(shù)或?qū)傩怨╉撁媸褂?br />
宿主環(huán)境相關(guān)簡介
宿主簡單介紹:什么是宿主環(huán)境 ?
宿主環(huán)境(host environment)指的是程序運行所必須的依賴環(huán)境。例如:Android 系統(tǒng) 和 iOS 系統(tǒng) 系統(tǒng)是兩個不同的宿主環(huán)境。安卓版的微信 App 是不能在 iOS 環(huán)境下運行的,所以,Android 是安卓軟件的宿主環(huán)境,脫離了宿主環(huán)境的軟件是沒有任何意義的!
安卓如圖所示 :
小程序的宿主環(huán)境
手機微信是小程序的宿主環(huán)境 如圖所示:
小程序借助宿主環(huán)境提供的能力 ,可以完成許多普通網(wǎng)頁無法完成的功能,例如:微信掃碼、微信支付、微信登錄、地理定位、etc……
小程序宿主環(huán)境包含的4點內(nèi)容
1、通信模型
小程序的宿主環(huán)境 - 通信模型
通信的主體
小程序中通信的主體是渲染層和邏輯層,其中:
① WXML 模板 和 WXSS 樣式工作在渲染層
② JS 腳本工作在邏輯層
小程序的通信模型
小程序中的通信模型分為兩部分,其中:
① 渲染層和邏輯層之間的通信 由微信客戶端進行轉(zhuǎn)發(fā)
② 邏輯層和第三方服務(wù)器之間的通信 由微信客戶端進行轉(zhuǎn)發(fā)
好了 今天就到這吧。。。。有需要繼續(xù)科普哦
如沒特殊注明,文章均為方維網(wǎng)絡(luò)原創(chuàng),轉(zhuǎn)載請注明來自http://m.oulysa.com/news/6549.html