二階段學習過程:
(一)看官方文件的框架、元件、api:
(三)模仿並寫出各個demo(模板應用demo、快遞查詢demo、登陸介面demo)
btnclick:function注:方法的引數也可以是另乙個方法wxml模板引用:模板的使用有兩種方式:());
console.log(thispage.data.info);
});},
input:
function
(event)); //
獲取輸入的運單號
}
方法1:引入**如下
<附:此處引用的模板內容include
src="../templates/header"
/>
<方法2:引入**如下text
>}
text
>
<附:此處引用的模板內容import
src="../templates/footer"
/>
<
template
is="footer1"
data
="}"
/>
<
template
is="footer2"
data
="}"
/>
<wxml中if和for的使用:wx:if:格式如下template
name
="footer1"
>
!! this is footer1 (testmsg: }) !!
template
>
<
template
name
="footer2"
>
!! this is footer2 (testmsg: }) !!
template
>
<即當前頁面中變數show的值為true時,顯示變數iftext的內容+"show";否則顯示變數iftext的內容+"no-show"view
wx:if
="}"
>} show
view
>
<
view
wx:else
>} no-show
view
>
wx:for:格式如下
-----------wx:for的使用1迴圈次數為fortext的元素個數次,大概類似foreach的用法<
view
wx:for
="}"
>
}-}
view
>
-----------wx:for的使用2
<
view
wx:for
="}"
wx:for-item
="demoitem"
>
}-}
view
>
視窗跳轉(導航)方法:
①wx.redirectto:這個方法會將當前頁面關閉,不會保留在後台中,無法直接返回。
②wx.n**igateto:這個方法會保留當前頁面在後台。
③wx.switchtab:這個方法用於跳轉到有tabbar的頁面,並關閉所有非tabbar頁面。
④wx.relaunch:這個方法會關閉當前的所有頁面,並開啟目標頁面。
⑤wx.n**igatback:
使用方法:
①在*.js中使用:
wx.****();
wx.n**igateback()②在*.wxml中使用:
<給目標頁面傳遞資料:在url後面新增?a=0&b=1即可,具體**如下:n**igator
url="../index/index"
>no-redirect
n**igator
>
<
n**igator
url="../index/index"
redirect
>redirect
n**igator
>
wx.****();
onload : function小技巧:當不知道資料的內容或格式的時候,可以用console.log(var);顯示在控制台(console)中,即可檢視它的內容和結構,如圖:(options));
}
圖1 控制台(console)中顯示資料的結構
圖2 知道資料的結構後摘取其中資料的**
個人感想:
在本次階段學習中,最主要有三個問題,實在是令人抓狂。
三是開發工具本身的除錯介面,顯示出來的頁面元件和實際元件的位置不相應,一開始沒發現這個問題,導致測試不了輸入框輸入內容的觸發事件的方法。
微信小程式學習筆記
1 background image 只能用網 絡url 或者base64 本地圖 片要用image 標籤才行 2 事件綁 定value 是乙個字串,需要在對應的 page 中定義 同名的函式。不然當觸 發事件的時候會 報錯。3 bind事件綁 定不會阻止冒泡事件向上冒泡,catch事件綁 定可以阻...
微信小程式學習筆記
主要用於 編寫和效果預覽,還可以進行 真機除錯 2 雲開發控制台 wxml 對應html,提供很多常用的元件。wxss 對應css,基本沒差別,目前體會最深的是尺寸單位rpx替代畫素單位px,能很方便的適配各種解析度的手機。js 同js。json 同json。pages 乙個頁面對應乙個資料夾,乙個...
微信小程式學習筆記
資料繫結 條件渲染和列表渲染 模板樣式匯入事件是檢視層到邏輯層的通訊方式。事件分為冒泡事件和非冒泡事件 冒泡事件 當乙個元件上的事件被觸發後,該事件會向父節點傳遞。非冒泡事件 當乙個元件上的事件被觸發後,該事件不會向父節點傳遞。json wxml js page.js page bindminus ...