美文网首页
RN 网络请求,

RN 网络请求,

作者: 废材helloword | 来源:发表于2018-11-11 23:35 被阅读17次

    componentDidMount() {

        this.getFirst();

      }

    //上拉加载

      getFirst = () => {

        let api =

          "https://cnodejs.org/api/v1/topics?page=" +

          this.state.page +

          "&tab=job&limit=20";

        fetch(api)

          .then(arr => arr.json())

          .then(aee => {

            this.setState({

              data: aee.data

            });

          });

      };

    //下拉加载

      getNext = () => {

        this.setState({

          page: this.state.page + 1

        });

        let api =

          "https://cnodejs.org/api/v1/topics?page=" +

          this.state.page +

          "&tab=job&limit=20";

        fetch(api)

          .then(arr => arr.json())

          .then(aee => {

            this.setState({

              data: [...this.state.data, ...aee.data]

            });

          });

      };

    //渲染Flastlist

    render() {

        return (

          <FlatList

            data={this.state.data}

            renderItem={({ item }) => {

              return (

                <TouchableOpacity

                  onPress={() => {

                    this.props.navigation.navigate("Detils", { name: item });

                  }}

                >

                  <View>

                    <Text style={{ fontSize: 20 }}>{item.title}</Text>

                  </View>

                </TouchableOpacity>

              );

            }}

    //进度条

            refreshing={this.state.refreshed}

            onRefresh={this.getFirst}

            onEndReached={this.getNext}

            onEndReachedThreshold={0.0001}

          />

        );

      }

    相关文章

      网友评论

          本文标题:RN 网络请求,

          本文链接:https://www.haomeiwen.com/subject/lcaffqtx.html