Question

我遇到了一些麻烦，我正在获取正在获取的JSON数据，然后呈现数据。但是在渲染中我需要执行另一次获取，因为我正在尝试渲染的数据依赖于第一个JSON。

你可以看到我正在尝试抓取返回的值，但它是未定义的。

所以fetch看起来像这样：

getFeaturedImage(thumbnail_json) {
    fetch(thumbnail_json)
      .then((response) => response.json())
      .then((responseData) => {
        return responseData.media_details.sizes.medium.source_url;
      })
      .done();
  }

并且renderPost（）是：

renderPosts() {
    contents = this.state.posts.map((post) => {
      let postDate = Moment(post.date).format('LLL');

      if ( post._links['wp:featuredmedia'] ) {
        console.log('has featured image');
        let thumbnail_json = post._links['wp:featuredmedia'][0].href;
        this.getFeaturedImage(thumbnail_json);
        console.log(this.getFeaturedImage(thumbnail_json)); // <----- UNDEFINED?
      } else {
        console.log('no featured image');
      }

      return (
        <View key={post.id} style={ postStyles.postContainer }>
          <Text style={postStyles.postTitle}>
            {post.title.rendered}
          </Text>
          <Text style={postStyles.postDate}>
            {postDate}
          </Text>
          <View style={ postStyles.excerptContainer }>
            <HTMLView stylesheet={htmlStyles}
              value={post.excerpt.rendered}
            />
          </View>
        </View>
      );
    });
    return (
      <ScrollView>
        <View style={baseStyles.container}>
          {contents}
        </View>
      </ScrollView>
    );
  }

Answer 1

您的功能目前无法返回任何内容，请在获取前添加退货：

getFeaturedImage(thumbnail_json) {
  return fetch(thumbnail_json)
  .then((response) => response.json())
  .then((responseData) => {
    return responseData.media_details.sizes.medium.source_url;
  })
  .done();

}

Answer 2

您可以将getFeaturedImage中的回调函数作为参数传递，并在success上调用

mycallback(result) {
    //do what you want with result
}
getFeaturedImage(thumbnail_json, callback) {
    fetch(thumbnail_json)
      .then((response) => response.json())
      .then((responseData) => {
        callback(responseData.media_details.sizes.medium.source_url);
      })
      .done();
  }

renderPosts() {
    contents = this.state.posts.map((post) => {
      let postDate = Moment(post.date).format('LLL');

      if ( post._links['wp:featuredmedia'] ) {
        console.log('has featured image');
        let thumbnail_json = post._links['wp:featuredmedia'][0].href;
        this.getFeaturedImage(thumbnail_json, this.mycallback);
        console.log(this.getFeaturedImage(thumbnail_json)); // <----- UNDEFINED?
      } else {
        console.log('no featured image');
      }

      return (
        <View key={post.id} style={ postStyles.postContainer }>
          <Text style={postStyles.postTitle}>
            {post.title.rendered}
          </Text>
          <Text style={postStyles.postDate}>
            {postDate}
          </Text>
          <View style={ postStyles.excerptContainer }>
            <HTMLView stylesheet={htmlStyles}
              value={post.excerpt.rendered}
            />
          </View>
        </View>
      );
    });
    return (
      <ScrollView>
        <View style={baseStyles.container}>
          {contents}
        </View>
      </ScrollView>
    );
  }

从render（）中的fetch中检索返回值？

2 个答案: