javascript - Axios API get request with Redux not able to pass in variable in action

Question

我试图在我的操作中将变量传递到 axios 请求中:

export function searchRequest(search){
    return(dispatch)=>{
        console.log('in search', search)
        return axios.get(`http://localhost:4000/reports/${search}`)
                .then(response => {

                    dispatch(searchInfo(response.data))
                })
    }
}

当我控制日志搜索时，它没有注册。

但是，当我删除 .then 中的返回调度和控制台日志 response.data 时，我得到了所需的数据，但我无法使用调度。

问题是，为什么我用这种方式无法传入搜索？

编辑:这是 native react

Answer 1

我不确定您如何在 React-native 中将此功能连接到 Redux，但我认为它的工作方式与您在常规 React 中所做的一样。searchRequest 函数返回一个带有一个变量 dispatch 的新函数。 search 将使用您在调用 searchRequest 时传入的值“静态”，因此可能为 null 或 undefined 或某些硬编码值。你应该反过来:

import {connect} from 'react-redux'

const searchRequest = (dispatch) => {
   return async (search) => {
      const response = await axios.get(`http://localhost:4000/reports/${search}`)
      dispatch(searchInfo(response.data))
   }
}

class YourComponent extends Component {
....
  onSearch = (search) => {
     this.props.doSearch(search)
  }
....
}

const mapDispatch = (dispatch) => ({
  doSearch: searchRequest(dispatch)
})

export connect(null, mapDispatch)(YourComponent)

这就是“普通网络”-React 的样子。也许在本地它看起来不同。请注意，dispatch 仅作为参数提供一次。之后调用 doSearch 时，在函数内部使用相同的分派(dispatch)实例。