在React Native中刷新子组件的全部数据

const items = [
  { id: 1, name: 'Item 1' },
  { id: 2, name: 'Item 2' },
  { id: 3, name: 'Item 3' },
];	
 
return (
  <div>
    {items.map((item) => (
      <div key={item.id}>{item.name}</div>
    ))}
  </div>
);

import React, { useState } from 'react';
import { Text, ScrollView, RefreshControl, View } from 'react-native';
 
const Card = () => {
  const [now] = useState(new Date().toLocaleString());
 
  return (
    <View style={{ flex: 1 }}>
      {Array.from({ length: 100 }).map((_, index) => (
        <Text key={index} style={{ textAlign: 'center', justifyContent: 'center', fontSize: 16 }}>{`${now}`}</Text>
      ))}
    </View>
  );
};
 
const List = () => {
  const [key, setKey] = useState(new Date().getTime());
  const [refreshing, setRefreshing] = useState(false);
 
  const handleRefresh = () => {
    setRefreshing(true);
    setTimeout(() => {
      setKey(new Date().getTime());
      setRefreshing(false);
    }, 1000);
  };
 
  return (
    <ScrollView
      style={{ flex: 1, backgroundColor: 'white', padding: 20 }}
      refreshControl={
        <RefreshControl refreshing={refreshing} onRefresh={handleRefresh} colors={['blue', 'red', 'green']} />
      }
    >
      <View style={{ flex: 1, flexDirection: 'row' }}>
        <Card key={key} /> {/* 키 값을 새로 설정 */}
        <Card /> 
      </View>
    </ScrollView>
  );
};
 
export default List;

import React, { useState } from 'react';
import { Text, ScrollView, RefreshControl, View } from 'react-native';
 
const Card = () => {
  const [now] = useState(new Date().toLocaleString());
 
  return (
    <View style={{ flex: 1 }}>
      {Array.from({ length: 100 }).map((_, index) => (
        <Text key={index} style={{ textAlign: 'center', justifyContent: 'center', fontSize: 16 }}>{`${now}`}</Text>
      ))}
    </View>
  );
};
 
const List = () => {
  const [key, setKey] = useState(new Date().getTime());
  const [refreshing, setRefreshing] = useState(false);
 
  const handleRefresh = () => {
    setRefreshing(true);
    setTimeout(() => {
      setKey(new Date().getTime());
      setRefreshing(false);
    }, 1000);
  };
 
  return (
    <ScrollView
      key={key} // 키 값을 새로 설정
      style={{ flex: 1, backgroundColor: 'white', padding: 20 }}
      refreshControl={
        <RefreshControl refreshing={refreshing} onRefresh={handleRefresh} colors={['blue', 'red', 'green']} />
      }
    >
      <View style={{ flex: 1, flexDirection: 'row' }}>
        <Card key={key} />
        <Card />
      </View>
    </ScrollView>
  );
};
 
export default List;