小程式學習 2

官方文件很詳細，基本上是照著上邊的內容梳理的

跟所有模板語言一樣，wxml 支援資料繫結、條件渲染、迴圈、模組化等功能

wxml 中的動態資料均來自對應 page 的 data

}view>

page(,

onload: function
() })

元件的屬性、要寫在""之內

id="item-}">

view>
checked="}">
checkbox>

}內可以進行簡單運算

更多運算規則請檢視這裡

條件渲染，適合根據資料輸出不同狀態的 wxml

wx:if="}">1view>

wx:elif="}">2view>
wx:else>3view>

標籤，乙個不是元件的標籤，不會再頁面渲染，只接受控制屬性，一般用於多個元件的包裝

wx:if="}">

view1 view>
view2 view>
block>

wx:if 和 hitdden

wx:if 只有在為true 的時候才會渲染元件，改變為 false 時，會區域性渲染 銷毀元件，hidden 的元件始終會被渲染，只是簡單的控制顯示隱藏，因此：需要頻繁切換 用 hidden ；執行時條件變化可能性低的 用 wx:if

在元件上使用wx:for控制屬性繫結乙個陣列，即可使用陣列中各項的資料重複渲染該元件。

預設陣列的當前項的下標變數名預設為index，陣列當前項的變數名預設為item

} 表示要遍歷的資料

wx:key="id" 使用唯一欄位的標識，跟react 的 key 一樣可以提公升效能
wx:for-index="index" 指定陣列當前下標的變數名
wx:for-item="item" 指定陣列當前元素的變數名，
-->
wx:for=", ]}}"
wx:key="id"
wx:for-index="idx"
wx:for-item="item">
}: }        
view>

wxml提供模板（template），可以讓我們復用一些wxml片段

定義模板

name="temp">

this is templatetext>
}text>
view>
template>

使用模板

模板只能使用 data 傳入的資料

is="temp"
data="}" />

引入外部的模板 import

name="item">
}text>
template>
src="item.wxml">
import>
wx:for="}"
wx:for-item="post"
wx:key="id">
is="item"
data="}">
template>
block>

注意：import 可以引入目標檔案的template，但是目標檔案import 的template 不會被引入

引入外部檔案（整體引入include）

include可以將目標檔案除了的整個**引入，相當於是拷貝到include位置

header view>
src="header.wxml"/>
body view>

一般書寫方式

id="taptest"

data-hi="haihai"
bindtap="tapname">click meview>

// 繫結函式tapname 只是乙個函式名稱，預設接受乙個event物件作為引數

page(,
tapname : function
(event) 
})

以bind 或者 catch 開頭 ，然後 加上事件的型別 bindtap catchtap

bind 和 catch 的區別：bind 不組織冒泡；catch 可以阻止冒泡事件向上冒泡

event 屬性

注意 data- 自定義屬性 不能有大寫，有-連字元，取值的時候要去駝峰命名的，如data-element-type取值event.target.dataset.elementtype

wxss 是一套樣式語言，用於描述 wxml 的元件樣式，wxss 具有 css 大部分特性，另外還有一些擴充

規定螢幕寬度 750rpx 開發時盡量都使用 rpx 單位 ，類似於 rem 是可以根據螢幕寬度自適應的單位

元件上可以使用style 和 class 來控制項樣式

class 中寫入靜態的樣式 style 中接收 動態的樣式，在執行時會解析

一般css 選擇器都會支援，*選擇器 好像不支援，

C 學習小程式

老師發布了乙個程式的些許部分叫我們補足。類似於乙個遊戲的封面 下面是主函式 include comgame.h int main 然後是三個標頭檔案 ifndef comgame h define comgame h include hero.h include skin.h include inc...

微信小程式入門筆記 小程式建立（2）

我選用的是穩定版 macos 一 掃碼登入開發工具 二 點選小程式建立專案 主要目錄介紹 cloudfunctions 雲開發中編寫雲函式的目錄 乙個小程式主體部分由三個檔案組成，必須放在專案的根目錄，如下 檔案必需作用是 小程式邏輯 是小程式公共配置 否小程式公共樣式表 乙個小程式頁面由四個檔案組...

小程式學習之小程式框架 flex布局

1.基本概念 1 flex模型 當頁面需要適應不同螢幕尺寸以及裝置型別時該模型可以確保元素在恰當的位置 2 容器和專案 用於包含內容的元件是容器，容器內部元件是專案。容器允許包含巢狀。3 座標軸 預設水平布局，水平從左向右是主軸，垂直從上到下是交叉軸。可用flex direction column互...