我有以下 Action 创建者,由于某种原因,dispatch 中的代码没有执行,尽管我知道 loginSuccess() 得到因为第一个警报触发而被调用。我做错了什么?
import facebook from '../api/facebook'
import * as types from '../constants/ActionTypes';
export function loginSuccess() {
alert("This alerts fine");
return dispatch => {
alert("This doesn't alert");
}
}
我正在使用 Thunk(或者至少认为我是正确的),如下面创建商店时所示。
import App from './containers/App';
import React, { Component } from 'react';
import { Provider } from 'react-redux';
import configureStore from './store';
import createReducer from './reducers';
import { createStore, applyMiddleware } from 'redux'
import Parse from 'parse/react-native';
import { AsyncStorage } from 'react-native';
import Settings from './settings';
import thunk from 'redux-thunk'
import logger from 'redux-logger'
const settings = Settings.load();
const middleware = [ thunk, logger() ]
const store = createStore(
createReducer(),
applyMiddleware(...middleware)
)
function setup() {
class Root extends Component {
render() {
return (
<Provider store={store}>
<App />
</Provider>
);
}
}
return Root;
}
module.exports = setup;
正在调用 loginSuccess()
的组件如下所示...
import { View, Text } from 'react-native';
import React, { Component,PropTypes } from 'react';
import { loginSuccess,loginError } from '../../../actions/application'
import {
LoginButton,
GraphRequest,
GraphRequestManager,
GraphRequestConfig,
} from 'react-native-fbsdk'
class FacebookLogin extends Component {
_onLoginSuccess(result){
loginSuccess();
};
_onLoginError(error){
loginError();
}
_onLoginCancelled(){
}
render(){
return (
<View>
<LoginButton
readPermissions={["email","public_profile","user_friends"]}
onLoginFinished={
(error, result) => {
if (error) {
this._onLoginError(error);
} else if (result.isCancelled) {
this._onLoginCancelled();
} else {
this._onLoginSuccess(result);
}
}
}
onLogoutFinished={() => alert("User logged out")}/>
</View>
);
}
}
FacebookLogin.propTypes = {
navigator: PropTypes.object.isRequired,
};
export default FacebookLogin;
最佳答案
FacebookLogin
组件中存在一些错误。
- 该组件未连接到
redux
。执行类似export default connect()(FacebookLogin)
的操作。您需要从react-redux
导入 - 您需要分派(dispatch)
loginSuccesss
操作,而不是直接调用它。因此,您需要执行类似this.props.dispatch(loginSuccess())
的操作
connect
HTH
关于reactjs - Redux Dispatch 在 Action Creator 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38758366/