ReactNative/intro react

من موسوعة حسوب

أساسيات React

يُشغَّل إطار عمل React Native على React، وهي مكتبة شائعة ومفتوحة المصدر تُستخدَم لبناء واجهات المستخدم باستخدام لغة JavaScript. يجب فهم React فهمًا جيدًا لتحقيق أقصى استفادة من React Native. تساعدك هذه الصفحة للبدء أو لاستذكار المفاهيم الأساسية من React والتي هي:

  • المكونات components
  • JXC
  • props
  • state

يمكنك الاطلاع على توثيق React، إن أردت التعمق أكثر.

المكوّن الأول

يستخدم المثال التالي المكون Cat:

مكون الدالة Function component

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

const Cat = () => {
  return (
    <Text>Hello, I am your cat!</Text>
  );
}

export default Cat;

مكون الصنف Class component

تميل مكونات الصنف إلى تكون أطول من مكونات الدالة.

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

class Cat extends Component {
  render() {
    return (
      <Text>Hello, I am your cat!</Text>
    );
  }
}

export default Cat;