State & Props

Props Review

Props adalah immutable data passed dari parent ke child component untuk konfigurasi.

State dengan useState Hook

State adalah mutable data yang bisa berubah dan trigger re-render ketika update.

jsx
import { useState } from 'react';

function Counter() {
  const [count, setCount] = useState(0);
  
  return (
    <View>
      <Text>{count}</Text>
      <Button title="Increment" onPress={() => setCount(count + 1)} />
    </View>
  );
}

Data Flow

React mengikuti unidirectional data flow:

• Parent → Child via props
• Child → Parent via callback functions

Lifting State Up

Ketika multiple children perlu share state, move state ke parent component.

useEffect Hook

Side effects running setelah render:

jsx
useEffect(() => {
  console.log('Component mounted or dependencies changed');
  return () => console.log('Cleanup');
}, [dependency]);

Props Drilling Problem

Passing data through many intermediary components. Solution: Context API atau State Management libraries.