从react js中的子文件夹导入模块

时间:2018-02-18 12:48:02

标签: javascript reactjs

您好我刚学习ReactJs,我正在尝试从子文件夹中导入一个模块,这里是我的文件夹结构

-src
---components
-----layout
-------Header.js
-------Navigation.js
-----fakeAuth.js

从Header.js模块,我试图从父(组件)导入fakeAuth,但它似乎无法调用模块或者我只是缺少某些东西?

我已经尝试了以下

import fakeAuth from './fakeAuth'
import fakeAuth from '././fakeAuth'
import fakeAuth from '../../fakeAuth'

仍然没有运气,我知道这对一些人来说很容易。感谢

这里是我的fakeAuth.js,来自react-router-dom教程。

module.exports  = {
    isAuthenticated: false,
    authenticate(cb) {
      this.isAuthenticated = true;
      setTimeout(cb, 100); // fake async
    },
    signout(cb) {
      this.isAuthenticated = false;
      setTimeout(cb, 100);
    }
  };

2 个答案:

答案 0 :(得分:2)

应为import fakeAuth from '../fakeAuth'

你必须在你有fakeAuth.js文件的地方找到1个文件夹。添加'..'可以做到这一点。

答案 1 :(得分:1)

由于您正在使用module.exports,因此您可以在Header.js内以下列方式导入:

import { isAuthenticated, authenticate, signout  } from "../fakeAuth";

CodeSandbox Demo