反应文件导入问题

时间:2018-12-23 06:38:24

标签: javascript html css reactjs react-router

我对React还是很陌生,由于缺少更好的词汇,在尝试导入“子组件”时遇到了一个问题。

在App.js文件中,我导入了标头类:从'./Components/Header/Header'导入标头;哪个工作正常。

在Header.js文件中,我正在使用路由器来选择不同的组件。但是,当我尝试导入Home类时:从'../Subcomponents/HomePage/HomePage'导入Home;我收到以下错误:找不到模块:无法解析'../ Subcomponents / HomePage / HomePage'

我的文件结构是:

  • app.js
  • Components / Header / Header.js
  • Subcomponents / HomePage / HomePage.js

App.js代码:

import React, { Component } from 'react';

import Header from './Components/Header/Header';
import Footer from './Components/Footer/Footer';
import Body from './Components/Body/Body';

import './Assets/css/mainCSS.css';

class App extends Component {
  render() {
    return (
      <div className="App">

      <Header />

        <Body />

      <Footer/>

      </div>
    );
  }
}

export default App;

标题代码:

import React from 'react';
import Home from '../Subcomponents/HomePage/HomePage';

import { Router, Route, Link } from 'react-router-dom';


const header = () => {
    return <header>
        <Router>
            <nav>
                <ul>
                    <li>
                        <Link to='/'>Home</Link>
                    </li>
                </ul>

                <hr />

                <Route excat path ="/" component={Home} />

            </nav>
        </Router>
    </header>

}

export default header;

首页代码:

import React from 'react';

const homepage =() =>{
    return <p>
        homepage working
        
        </p>
}

export default homepage;

我在这里做错什么了吗,或者在React中这不可能吗?任何建议将不胜感激!

谢谢!

1 个答案:

答案 0 :(得分:2)

a=[["a","b"],["c","d"]] for i in a: for j in i: print(j, end=' ') print() 中,Header.js将您带入../,而不是父级。应该是Components

此外,恕我直言:在每个组件文件夹中,将文件命名为'../../Subcomponents/HomePage/HomePage',以便将其自动导出。比您只能做的事情:index.js