applyMiddleware()被忽略?终极版-的thunk永远不会触发回调,终极版,记录器将无法登录,一切都做得正确
问题描述:
我不知道是怎么回事,我在正确使用这种技术阵营原住民,但不会工作,ReactJSapplyMiddleware()被忽略?终极版-的thunk永远不会触发回调,终极版,记录器将无法登录,一切都做得正确
控制台只记录'外部',从不'内部',也不提供重新记录日志。
应用程序入口点:
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import { Provider } from 'react-redux'
import { createStore, applyMiddleware, combineReducers } from 'redux'
import thunk from 'redux-thunk'
import logger from 'redux-logger'
import App from './App';
import registerServiceWorker from './registerServiceWorker';
import { authStateReducer } from './reducers/auth.js'
import { wishesStateReducer } from './reducers/wishes.js'
const root = combineReducers({
auth: authStateReducer,
wishes: wishesStateReducer
})
let store = createStore(root, applyMiddleware(thunk, logger))
ReactDOM.render(
<Provider store={store}>
<App />
</Provider>,
document.getElementById('root')
);
registerServiceWorker();
导出根组件是这样的:
function stateToProps(state) {
return { AUTH: state.auth, WISHES: state.wishes }
}
function dispatchToProps (dispatch) {
return {
registerAuthStateListener:() => { dispatch(registerAuthStateListener) },
fetchWishes:() => { dispatch(fetchWishes) }
}
}
export default connect(
stateToProps,
dispatchToProps
)(App);
而且我正确地调用的动作componentDidMount():
componentDidMount() {
this.props.registerAuthStateListener()
this.props.fetchWishes()
}
永不激活的thunk示例:
import firebase from 'firebase'
export function fetchWishes() {
console.log("Outside")
return async (dispatch) => {
console.log("Inside")
let querySnapshot = await firebase.firestore().collection('wishes').get()
let newState = []
querySnapshot.forEach((wish) => {
newState.push({
id: wish.id,
...wish.data()
})
})
dispatch({
type: 'WISHES_FETCHED',
data: newState
})
}
}
例减速机:
const INITIAL_WISHES_STATE = {
wishes: []
}
export function wishesStateReducer (state = INITIAL_WISHES_STATE, action) {
switch (action.type) {
case 'WISHES_FETCHED':
return {
wishes: action.data
}
default:
return state
}
}
答
function dispatchToProps (dispatch) {
return {
registerAuthStateListener:() => { dispatch(registerAuthStateListener()) },
fetchWishes:() => { dispatch(fetchWishes()) }
}
}
我不是致电 thunk动作的创造者。
答
一切都在你的代码别人看起来不错,但我不太确定这部分:
return async (dispatch) => {
尝试改变,为:
return (dispatch) => {