代碼規(guī)范
注意: page中屬性和值使用等號連接
一個字符空格使用 全角空格  
關于window設置均設置在config中
官網(wǎng)
navigationBarTitleText--導航欄標題文字內(nèi)容
navigationBarBackgroundColor--導航欄背景顏色,如"#000000"
數(shù)據(jù).函數(shù) 存放位置
- 所有數(shù)據(jù)存放在
data對象中 - 所有函數(shù)存放在
methods對象中 - 生命周期函數(shù)位置 與
methods對象 平行
組件引入
使用 import引入組件后,需要在compoents中聲明
import wepy from 'wepy';
//引入List、Panel和Counter組件
import List from '../components/list';
import Panel from '../components/panel';
import Counter from '../components/counter';
export default class Index extends wepy.page {
//頁面配置
config = {
"navigationBarTitleText": "test"
};
//聲明頁面中將要使用到的組件
components = {
panel: Panel,
counter1: Counter,
counter2: Counter,
list: List
};
</script>
page屬性
watch 數(shù)據(jù)監(jiān)視器
監(jiān)聽器在watch對象中聲明,類型為函數(shù),函數(shù)名與需要被監(jiān)聽的data對象中的屬性同名,每當被監(jiān)聽的屬性改變一次,監(jiān)聽器函數(shù)就會被自動調(diào)用執(zhí)行一次
watch = {
inpval(newval,oldval){
console.log('新值'+newval+'---------舊值'+oldval);
}
}
computed 計算屬性
注意:只要是組件中有任何數(shù)據(jù)發(fā)生了改變,那么所有計算屬性就都會被重新計算。
// 計算屬性aPlus,在腳本中可通過this.aPlus來引用,在模板中可通過{{ aPlus }}來插值
computed = {
aPlus () {
return this.a + 1
}
}
props傳值
靜態(tài)傳值
父組件 ===> 子組件
只能傳遞String字符串類型
在父組件template模板部分的組件標簽中,使用子組件props對象中所聲明的屬性名作為其屬性名來接收父組件傳遞的值。
<child title="mytitle"></child>
// child.wpy
props = {
title: String
};
onLoad () {
console.log(this.title); // mytitle
}
只顯示兩行,多余使用省略號
text-overflow: ellipsis;
display: box;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
$emit 子傳父
// 比如有一個輸入彈框組件,點擊確定時把輸入的值傳出來;
confirm() {
// 輸出值傳遞給父組件
this.$emit('getInputModalValue', this.value)
}
// 使用這個組件的頁面中在events里接收事件 getInputModalValue
events = {
'getInputModalValue': (value, $event) => {
console.log(`${this.$name} receive ${$event.name} from ${$event.source.$name}`)
// value 即為傳出來的值
}
}
實時更新子組件數(shù)據(jù)
如果每次進入父頁面 , 都要更新子組件數(shù)據(jù) , 需要在父組件onShow中傳值到子組件
每次進入父組件
在onShow中 通過事件傳值到子組件
本地存儲
video 標簽巨坑
ios與Android兼容性
1. 不能添加 page-gesture 屬性,否則在ios下不能滑動
標題欄加載反饋```
wepy.showNavigationBarLoading()
wepy.hideNavigationBarLoading()
**注意點:**
1. page高度 使用`wepy.getSystemInfo` > `e.screenHeight`