Sử dụng Props, State bắt Sự kiện click trong React Native

14:00 17/05/2022

Như chúng ta đã biết, trong React Native, props là thuộc tính của component. Props được ứng dụng rộng rãi trong việc truyền dữ liệu từ component cha sang component con.

Dữ liệu sử dụng trong props là dữ liệu chỉ đọc, không thể cập nhật được.

Ngược lại, state được sử dụng để cập nhật dữ liệu có trong component.

Để hiểu hơn về props, state, chúng ta tiến hành xây dựng ứng dụng đếm số lần click vào Text.

Đầu tiên các bạn cần tạo 1 dự án React Native.

Tiếp đó bạn tạo 1 class có tên là PropStateExample.js

Ta sẽ code class này như sau:

  • Kế thừa từ lớp React.Component

  • Trong hàm khởi tạo ta khai báo props và state như sau:

Tại đây state sẽ có 2 biến: text để hiển thị còn dem để đếm số lần click vào text

  • Tiếp theo ta định nghĩa hàm updateText khi click vao text như sau:

  • Cuối cùng hàm render ta sẽ gọi hàm vừa định nghĩa và gọi biến hiển thị như sau:

  • Kết quả cuối cùng:

  • Giờ chạy chương trình và click vào text thì text sẽ thay đổi theo số lần click

Chúc các bạn thành công!

Cùng chuyên mục

Đăng Kí học Fpoly 2023

Bình Luận