如何使用操作和 axios.get() (Redux) 从本地 json 文件中获取数据？答案

【问题标题】：How to get data from local json file using actions and axios.get() (Redux)?如何使用操作和 axios.get() (Redux) 从本地 json 文件中获取数据？
【发布时间】：2018-04-14 07:49:35
【问题描述】：

我写了 Action，应该从 db.json 文件中获取数据。但是

错误：消息“xhr.js:178 GET http://localhost:8083/data/db.json404 （未找到）”。

如果我的路径正确（db.json 在同一个文件夹中），为什么会这样？在 profileActions.js 中：

import axios from "axios";
var customData = require('./db.json');

export function fetchUsers(){
    return function(dispatch){
        axios.get('./db.json')
            .then((response) => {
                dispatch({type:'FETCH_USERS_FULFILLED', payload:response.data});
            })
            .catch((err) => {
                dispatch({type:'FETCH_USERS_REJECTED', payload:err});
            })
    }
}

【问题讨论】：

你试过给 db.json 的绝对路径吗？
请查看github.com/nuxt/nuxt.js/issues/123
你在使用 webpack 吗？
接受的答案很好。如果您需要更多信息，那么这是一个很好的指南pluralsight.com/guides/…

标签： json reactjs redux react-redux axios

【解决方案1】：

我知道这个问题很久以前就有答案了。它将帮助像我这样的人。除了使用 axios 或其他网络库之外，您还可以像下面这样直接导入 json 文件并在调度程序中返回它。如果您使用本地 json 来测试它，为什么需要网络库。

import data from './response.json'

export function initializeApp() {
  return function (dispatch) {
    dispatch({
      type: ActionTypes.ActionName,
      payload: data
    });

  }
}

【讨论】：

【解决方案2】：

我之前遇到过类似的问题。我通过create-react-app命令创建了我的react app。发现只能从public文件夹中获取静态文件。如果要获取“db.json”，您应该将“db.json”放入公共文件夹。

【讨论】：