使用 React Native + Redux 获取数据不起作用
Data fetching with React Native + Redux not working
我正在构建我的第一个 React Native 应用程序,并将 Redux 用于我应用程序内的数据流。
我想从我的 Parse backend and display it on a ListView
. My only issues at the moment is that for some reason, the request that I create using fetch()
for some reason isn't actually fired. I went through the documentation and examples in the Redux docs and also read this really nice blog post 加载一些数据。他们基本上做了我想要实现的事情,但我不知道我的实现与他们的代码示例有什么不同。
这是我目前的设置(已缩短以仅显示相关部分):
OverviewRootComponent.js
class OverviewRootComponent extends Component {
componentDidMount() {
const { dispatch } = this.props
dispatch( fetchOrganizations() )
}
}
Actions.js
export const fetchOrganizations = () => {
console.log('Actions - fetchOrganizations');
return (dispatch) => {
console.log('Actions - return promise');
return
fetch('https://api.parse.com/1/classes/Organization', {
method: 'GET',
headers: {
'X-Parse-Application-Id': 'xxx',
'X-Parse-REST-API-Key': 'xxx',
}
})
.then( (response) => {
console.log('fetchOrganizations - did receive response: ', response)
response.text()
})
.then( (responseText) => {
console.log('fetchOrganizations - received response, now dispatch: ', responseText);
dispatch( receiveOrganizations(responseText) )
})
.catch( (error) => {
console.warn(error)
})
}
}
当我像这样调用 dispatch( fetchOrganizations() )
时,我确实看到了 Actions - return promise
之前的日志,但它似乎并没有真正触发请求。我不太确定如何进一步调试它或咨询哪些资源可以帮助我解决这个问题。
我假设 Redux 期待一个 Promise 而不是一个函数。是真的吗?
如果是这样,我认为您的 return 功能可能无法正常工作。
您的 return 之后有一个新行,并且 JavaScript 可能(有帮助地)在那里插入一个分号。
看这里:Why doesn't a Javascript return statement work when the return value is on a new line?
我正在构建我的第一个 React Native 应用程序,并将 Redux 用于我应用程序内的数据流。
我想从我的 Parse backend and display it on a ListView
. My only issues at the moment is that for some reason, the request that I create using fetch()
for some reason isn't actually fired. I went through the documentation and examples in the Redux docs and also read this really nice blog post 加载一些数据。他们基本上做了我想要实现的事情,但我不知道我的实现与他们的代码示例有什么不同。
这是我目前的设置(已缩短以仅显示相关部分):
OverviewRootComponent.js
class OverviewRootComponent extends Component {
componentDidMount() {
const { dispatch } = this.props
dispatch( fetchOrganizations() )
}
}
Actions.js
export const fetchOrganizations = () => {
console.log('Actions - fetchOrganizations');
return (dispatch) => {
console.log('Actions - return promise');
return
fetch('https://api.parse.com/1/classes/Organization', {
method: 'GET',
headers: {
'X-Parse-Application-Id': 'xxx',
'X-Parse-REST-API-Key': 'xxx',
}
})
.then( (response) => {
console.log('fetchOrganizations - did receive response: ', response)
response.text()
})
.then( (responseText) => {
console.log('fetchOrganizations - received response, now dispatch: ', responseText);
dispatch( receiveOrganizations(responseText) )
})
.catch( (error) => {
console.warn(error)
})
}
}
当我像这样调用 dispatch( fetchOrganizations() )
时,我确实看到了 Actions - return promise
之前的日志,但它似乎并没有真正触发请求。我不太确定如何进一步调试它或咨询哪些资源可以帮助我解决这个问题。
我假设 Redux 期待一个 Promise 而不是一个函数。是真的吗?
如果是这样,我认为您的 return 功能可能无法正常工作。
您的 return 之后有一个新行,并且 JavaScript 可能(有帮助地)在那里插入一个分号。
看这里:Why doesn't a Javascript return statement work when the return value is on a new line?