ReactNative学习笔记

npm install -g create-expo-app@latest
npx create-expo-app@latest --template black
npx expo start -c

import { StatusBar } from 'expo-status-bar';
import { useState } from 'react';
import { Button, StyleSheet, Text, View } from 'react-native';

export default function App() {
  const [news, setNews] = useState([])

  //定义fetchData函数来异步获取新闻数据
  const fetchData = async() => {
    const res = await fetch("http://60s.likegamex.top/v2/60s");
    const {data}= await res.json();
    setNews(data.news);

  }

  return (
    <View style={styles.container}>
      {
        //map遍历news中的数据
        news.map(
          (newsData,index) => (
            <Text key={index}>
              {newsData}
            </Text>
          )
        )
      }
      <Button title="获取60s新闻" onPress={fetchData} />
      <StatusBar style="auto" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});