Giới thiệu về Page
Page là 1 instance đại diện cho các pages của app. Mỗi page được chia thành 1 folder và có 4 thành phần txml
, tcss
, js
và json
.
- index.js: chứa code logic của Page
- index.txml: chứa code về layout của Page
- index.tcss: chứa code về style của Page
- index.json: chứa các cấu hình cho Page
Page data
Khởi tạo data cho page
Page({
data: {
title: 'Tiki',
array: [{ user: 'Alex' }, { user: 'Lucy' }]
}
});
index.txml Render data cho page
<view>{{title}}</view>
<view>{{array[0].user}}</view>
Handle event cho page
<view onTap="handleTap">click me</view>
Khi user click button click me
, function handleTap
sẽ được trigger.
Xử lí event ở file index.js
Page({
handleTap() {
console.log('yo! view tap!');
}
});
Giả sử chúng ta muốn rerender lại page, sử dụng hàm this.setData() để set lại data, page sẽ tự rerender.
<view>{{text}}</view>
<button onTap="changeText"> Change normal data </button>
Page({
data: {
text: 'init data'
},
changeText() {
this.setData({
text: 'changed data'
});
}
});