Reactjs 如何在redux thunk中正确使用useSelector和useDispatch?

Reactjs 如何在redux thunk中正确使用useSelector和useDispatch?,reactjs,react-redux,react-hooks,redux-thunk,Reactjs,React Redux,React Hooks,Redux Thunk,有人能解释我怎么会错? 如何正确使用useSelector和useDispatch以及useEffect中的redux thunk异步函数 我的代码输出只返回屏幕上的“用户列表”标题,而不是我期望的用户列表 守则: import React, { useEffect } from 'react' import { useSelector, useDispatch } from 'react-redux' import { fetchUsers } from '../redux' functio

有人能解释我怎么会错? 如何正确使用useSelector和useDispatch以及useEffect中的redux thunk异步函数

我的代码输出只返回屏幕上的“用户列表”标题,而不是我期望的用户列表

守则:

import React, { useEffect } from 'react'
import { useSelector, useDispatch } from 'react-redux'
import { fetchUsers } from '../redux'

function UserContainer() {
    const userData = useSelector(state => state.user)
    const dispatch = useDispatch()

    useEffect(() => {
        dispatch(fetchUsers())
    },[dispatch])

    return userData.loading ? ( <h2>Loading...</h2> ) :
        userData.error ? (<h2>{userData.error}</h2>) :
        <div>
            <h2>User List</h2>
            <div>
                { userData && userData.users && userData.users.map(user => <p>{user.name}</p>) }
            </div>
        </div>

 }

 export default UserContainer
我发现了错误! 这是一个疏忽。 在操作函数I.map()中,不需要响应的地方:

const users=response.data.map(user=>user.id)

好的,这段代码是一个完美的例子,说明了如何在使用redux thunk的ajax调用中正确使用useSelector和useDispatch

我发现了错误! 这是一个疏忽。 在操作函数I.map()中,不需要响应的地方:

const users=response.data.map(user=>user.id)


好的,这段代码是一个完美的例子,说明了如何通过redux thunk的ajax调用正确使用useSelector和useDispatch。现在是respond 200,用户列表作为响应。你能提供一个redux商店或axios响应的例子吗?我忘了说…ajax调用工作正常。这是respond 200,包含响应的用户列表。您能否提供redux商店或axios响应的示例?
export const fetchUsers = () =>{
    return function(dispatch) {
        dispatch(fetchUsersRequest())
        axios.get('https://jsonplaceholder.typicode.com/users')
        .then(response => {
            const users = response.data
            dispatch(fetchUsersSuccess(users))
        })
        .catch(error => {
            dispatch(fetchUsersFailure(error.message))
        })

    }
}