Question

我有这个传奇，可以发出http请求并在reducer中进行调度：

// worker Saga: will be fired on GET_FILIAIS_REQUEST actions
function* fetchFiliais(action) {
    try {
        const data = yield call(LoginServices.fetchFiliaisApi);
        yield put(allActions.loginActions.receiveFilialData(data));
    } catch (e) {
        yield put({type: 'FETCH_FILIAIS_FAILED', message: e.message})
    }
}

/*
  Starts fetchFiliais on each dispatched `GET_FILIAIS_REQUEST` action.
*/

export default function* loginSaga() {
    yield takeEvery("GET_FILIAIS_REQUEST", fetchFiliais);
}

在我的登录组件中，我将此传奇称为：

const Login = props => {
  const dispatch = useDispatch()
  const filiais = useSelector(state => state.filiais)
  useEffect(() => {
    dispatch({type: 'GET_FILIAIS_REQUEST'})
    setTimeout(function(){ console.log(filiais); }, 5000);
  }, [dispatch, filiais])

这是我的减速器：在我的console.log（）中，打印正确的类型和有效负载，并在打印“输入正确的大小写”：

const currentUser = (state = {}, action) => {
    console.log(action.type)
    console.log(action.payload)

    switch(action.type){
        case "SET_USER":
            return {
                ...state,
                user: action.payload,
                loggedIn: true
            }
        case "LOG_OUT":
            return {
                ...state,
                user: {},
                loggedIn: false
            }
        case "RECEIVE_FILIAL_DATA":
            console.log('enter correct case')
            return {
                ...state,
                filiais: action.payload
            }
        default:
            return state
    }

但是我将一个setTimeOut放到console.log变量filiais，这个值是不确定的。为什么？

这是我的 index.js ：

import loginSaga from './pages/login/login-form/saga'

// create the saga middleware
const sagaMiddleware = createSagaMiddleware()

const store = createStore(
    rootReducer,
    applyMiddleware(sagaMiddleware)
)

// then run the saga
sagaMiddleware.run(loginSaga)

ReactDOM.render(
    <Provider store={store}>
        <Router>
            <Route path="/" component={App} />
        </Router>
    </Provider>, document.getElementById('root'));

这是我的根减少剂：

import currentUser from './login'
import { combineReducers } from 'redux'

const rootReducer = combineReducers({
    currentUser
})

export default rootReducer

Answer 1

但是我将一个setTimeOut放到console.log变量filiais，这个值是不确定的。为什么？

因为filiais是局部变量const。更改const的值是不可能的，这也不是分发操作要尝试执行的操作。

通过分派动作，最终可以指示组件重新渲染。重新渲染时，将创建一个新的局部变量，并为其分配新值。如果要记录新值，请将log语句放入组件主体中。

const filiais = useSelector(state => state.filiais)
console.log(filiais);
useEffect(() => {
  dispatch({type: 'GET_FILIAIS_REQUEST'});
}, [dispatch])

我的redux传奇使用useSelector打印未定义状态

1 个答案: