經過了幾天在畫面上的學習，究竟前端畫面要如何與後段的 api 串接呢？

ＲＮ 使用套件

    "@react-native-community/async-storage": "github:react-native-community/async-storage",

 React Native  exp code

  componentDidMount() {
    this.JSON_Post();
    ////元件載入前先取得資料
  }
 

  JSON_Post = () => {
    let url = '<ＡＰＩ>';
    fetch(url).then((response) => {
      return response.json();
    }).then((jsonData) => {
      console.warn('OK:');
      if (jsonData[0].Containers == "-1") {
        console.warn(jsonData[0].RepoTags);
        Alert.alert("更新成功");
        this.setState({ 變數: <值>,});
      }
      else {
        Alert.alert("更新失敗", "請檢查網路");
        this.setState({ refreshing: false });
      }
    }).catch((err) => {
      console.warn('錯誤:', err);
      Alert.alert("指派失敗", "請檢查網路");
      this.setState({ refreshing: false });
    })
  }

///存入
  getStorage = async () => {
    try {
      const value = await AsyncStorage.getItem('userToken');
      if (value !== null) {
        console.warn(value);
        this.setState({ userToken: value });
      }
    } catch (error) {
      console.log(error);
    }
  }

如何實作下拉更新

import {
  TouchableOpacity,
  ScrollView,
 RefreshControl,
  ListView
} from 'react-native';

  _onRefresh = () => {
    this.setState({ refreshing: true });
    this.JSON_Post()
    // this.setState({refreshing: false});
  }

Flutter 使用套件

Flutter exp code