React Native/Rails应用程序：试图从一个API发送数据到Postgres数据库onPress

我有一个应用程序，在React Native/Rails中定位和显示早午餐餐馆。数据来自Yelp API并呈现正常，我通过Rails后端使用了获取路径到API。我希望用户能够点击“Fav？”按钮在特定的餐厅下，并只发送该数据到我的rails应用程序中的postgres数据库。React Native/Rails应用程序：试图从一个API发送数据到Postgres数据库onPress

我不确定如何做到这一点，因为我的数据库的提取后路由连接，但它正在接收空字符串。我试着在函数顶部设置状态，但它不起作用。

这里是我的功能看起来像目前：

async savetoFavorites(e) { 
    this.setState({ 
    name: e.target.name, 
    image: e.target.image_url, 
    address: e.target.location.city, 
    phone: e.target.phone 
}) 
try { 
    let response = await fetch('http://myURL', { 
          method: 'POST', 
          headers: { 
          'Accept': 'application/json', 
          'Content-Type': 'application/json', 
          }, 
          body: JSON.stringify({ 
          favorite:{ 
           name: this.state.name, 
           image: this.state.image, 
           address: this.state.address, 
           phone: this.state.phone 
          } 
          }) 
         }); 
         let res = await response.text(); 
         if (response.status >= 200 && response.status < 300) { 

          const {navigate} = this.props.navigation; 
          navigate('Profile', {favorites: response}); 
          } else { 

          let error = res; 
          throw error; 
          } 
         } catch(errors) { 
         } 
         }

来源

2017-08-13 rdifede

一旦你有一个成功的回应，你应该setState。您对setState的调用可能导致重新渲染并导致空的响应。 –

所以我应该在函数结束时设置状态？我将如何格式化？我会把它放在导航之前吗？ – rdifede

你能解释一下你的代码吗？一旦成功的回应返回，会发生什么？你只需导航到个人资料页面？如果你离开的原因是甚至更新状态，因为它会丢失，除非你使用REDX或类似的东西来管理应用程序状态？你最终将状态传递给配置文件视图？ –

尝试将状态你有一个成功的响应后。也许你对setState的调用导致重新渲染并导致空的响应。

async savetoFavorites(e) { 
    e.preventDefault(); 
    try { 
    let response = await fetch('http://myURL', { 
     method: 'POST', 
     headers: { 
     'Accept': 'application/json', 
     'Content-Type': 'application/json', 
     }, 
     body: JSON.stringify({ 
     favorite: { 
      name: e.target.name, 
      image: e.target.image_url, 
      address: e.target.location.city, 
      phone: e.target.phone 
     } 
     }) 
    }); 
    let res = await response.text(); 
    if (response.status >= 200 && response.status < 300) { 
     this.setState({ 
     name: res.name, 
     image: res.image, 
     address: res.address, 
     phone: res.phone 
     }) 
     const { navigate } = this.props.navigation; 
     navigate('Profile', { favorites: res}); 
    } else { 
     let error = res; 
     throw error; 
    } 
    } catch (errors) {} 
}

来源

2017-08-13 21:39:31

React Native/Rails应用程序：试图从一个API发送数据到Postgres数据库onPress

回答

相关问题