Các component thường sử dụng trong react native

2023-04-25 02:50:06

Bài học hôm này chúng ta sẽ tìm hiểu 1 số các component core hay sử dụng trong react native

  • View
  • Text
  • Image
  • Button

VIEW COMPOENT

View là thành phần cơ bản nhất để xây dựng giao diện người dùng (view giống như div trong html)

import React from 'react';
import {View, Text} from 'react-native';

const App = ()=>{

   return (
      <View>
          <Text>Hello World!</Text>
      </View>
   )
}

TEXT COMPOENT

TEXT compoent sử dụng để hiển thị chữ trên màn hình

<Text>Message Here<Text>
<Text>{variable_here}<Text>

IMAGE COMPONENT

Image là thành phần hiển thị ảnh online hoặc local trong react-navtive:

​​​​​​​BUTTON COMPOENT

Button là một component cơ bản hoạt động khi người dùng nhấp vào nó

Các Thuộc tính trong Button

  • onPress: Hàm để sử lý khi người dùng nhấp vào nút.​

  • title: Hiển thị văn bản bên trong nút.​

  • color: Cài đặt màu nền.​

  • disable: Vô hiệu hóa người dùng tương tác với thành phần button.​

  • accessibilityLabel: Hiển thị văn bản hỗ trợ người khiếm thị.