Nhảy tới nội dung

Giới thiệu về Page

Cập nhật lần cuối vào

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, jsjson.

  • 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'
});
}
});