componentDidUpdate在执行网络请求时会给出RCTDeviceEventEmitter错误

我的应用程序有一个组件，每当用户刷新它时都会更新。
该组件每次都会获取新的道具，并且值会相应更新。
随着新的数据收到，我创建一个facebook图形API获取请求来获取用户的个人资料图像。
为了使它看起来更好，我添加了一个默认图像，直到获取请求结束。我在componentWillReceiveProps中将图像重置为默认值。
我得到的错误是“错误调用函数：RCTDeviceEventEmitter：发射”
它只有当我没有远程调试（使用chrome调试器的本机反应）时才会发生。
这是相关代码：componentDidUpdate在执行网络请求时会给出RCTDeviceEventEmitter错误

componentWillReceiveProps(nextProps){ 
    var temp; 
    temp=this.state.profileInfo; 
    temp.image='http://s3.amazonaws.com/cdn.roosterteeth.com/default/tb/user_profile_female.jpg'; 
    this.setState({ 
     profileInfo:temp, 
    }); 
    }, 
    componentDidUpdate(prevProps, prevState){ 
    if(prevProps!=this.props){ 
     console.log("Updated!!!"); 
     var api = 'https://graph.facebook.com/' + this.props.owner_id + 
        '/picture?type=normal&access_token=' + this.props.credentials.token; 
     fetch(api) 
      .then((response) =>{ 
       var temp; 
       temp=this.state.profileInfo; 
       temp.image=response.url; 
       this.setState({ 
       profileInfo:temp, 
       }); 
      }) 
      .done(); 
    } 
    }, 
    componentDidMount(){ 
    var api = 'https://graph.facebook.com/' + this.props.owner_id + 
        '/picture?type=normal&access_token=' + this.props.credentials.token; 
    fetch(api) 
      .then((response) =>{ 
      var temp; 
      temp=this.state.profileInfo; 
      temp.image=response.url; 
      this.setState({ 
       profileInfo:temp, 
      }); 
      }) 
      .done(); 
    },

有谁知道我怎么能解决这个问题？为什么只有在没有调试的时候？

来源

2017-04-22 Yinon Eliraz

看一看这个：github.com/facebook/react-native/issues/11764。有人用尽可能少的代码来解决相同的问题，所以这可能意味着问题不在于您的React组件。

反正你可以在所有的删除componentDidUpdate方法是这样的：

componentWillReceiveProps(nextProps){ 
    var temp; 
    temp=this.state.profileInfo; 
    temp.image='http://s3.amazonaws.com/cdn.roosterteeth.com/default/tb/user_profile_female.jpg'; 
    this.setState({ 
    profileInfo:temp, 
    },() => { 
    if(nextProps!=this.props) { 
     console.log("Updated!!!"); 

     var api = 'https://graph.facebook.com/' + nextProps.owner_id + 
     '/picture?type=normal&access_token=' + nextProps.credentials.token; 
     fetch(api) 
     .then((response) => { 
      var temp; 
      temp = this.state.profileInfo; 
      temp.image = response.url; 
      this.setState({ 
      profileInfo: temp, 
      }); 
     }) 
     .done(); 
    } 
    }); 
}, 
componentDidMount(){ 
    var api = 'https://graph.facebook.com/' + this.props.owner_id + 
    '/picture?type=normal&access_token=' + this.props.credentials.token; 
    fetch(api) 
    .then((response) =>{ 
     var temp; 
     temp=this.state.profileInfo; 
     temp.image=response.url; 
     this.setState({ 
     profileInfo:temp, 
     }); 
    }) 
    .done(); 
},

来源

2017-04-22 09:50:05 Shota

的错误消失，但它不工作。 'if（nextProps！= this.props）'总是假，我从不更新图片。当我看着拥有当前和以前道具的日志时，它们不一样。你知道为什么吗？ –

每次收到新道具时都会调用componentWillReceiveProps。 'nextProps！= this.props'实际上应该总是返回true（不知道为什么你会得到错误）。所以为了检查道具是否改变，我们应该逐个检查道具的属性（如：if（nextProps.owner_id！= this.props.owner_id））或者进行深入比较。在你的情况下，如果你想在每次删除'if（nextProps！= this.props）'时重新获取结果。 – Shota

我删除了条件，现在当不在调试模式下时出现相同的错误。 –

componentDidUpdate在执行网络请求时会给出RCTDeviceEventEmitter错误

回答

相关问题