导入功能时反应错误

Question

我在此遇到编译时错误

import createProfile from "../../actions/profileActions";

错误正在遵循编译失败。

[1]
[1] ./src/components/create-profile/CreateProfile.js
[1] 424:57-70 "export 'default' (imported as 'createProfile') was not found in '../../actions/profileActions

但是要导入的功能在profileActions.js中可用

export const createProfile = (profileData, history) => dispatch => {
  axios
    .post("/api/profile", profileData)
    .then(res => history.push("/dashboard"))
    .catch(err =>
      dispatch({
        type: GET_ERRORS,
        payload: err.response.data
      })
    );
};

Answer 1

您需要将createProfile一次导入

import {createProfile} from "../../actions/profileActions";

或将其导出为默认导出

export default createProfile

Answer 2

是的，React的第一次学习者犯了错误。

要使用其他文件中定义的功能，您需要

1.从定义的文件中导出功能。 2.将功能导入新文件。

它可以通过两种方式完成。

语法1：

export function someFunction(){}
export const constant1="ABC"

当要导出多个函数/常量时，请使用上述语法。

在这种情况下，如果要导入，请遵循以下语法。

import {function1,constant1,...} from <file-name>

语法2：

默认导出每个文件只能工作一个。即，您不能以默认方式导出两个函数/常量

export default function1=()=>{}//okay!!

export default function1=()=>{};
export default const someconstant;//ERROR !!

您现在可以像这样导入。

import function1 from <file-name>

Answer 3

import {createProfile} from "../../actions/profileActions";导入createProfile作为import {createProfile} from "../../actions/profileActions"; 否则将其导出为

const createProfile = (profileData, history) => dispatch => {
  axios
    .post("/api/profile", profileData)
    .then(res => history.push("/dashboard"))
    .catch(err =>
      dispatch({
        type: GET_ERRORS,
        payload: err.response.data
      })
    );
};
export default createProfile;