javascript - 如何在 React Js 中导入文件路径？

Question

我必须在 App.js 中导入多个文件。我的文件夹结构是

/src  
   /components       
     layout.js
   App.js  
   index.css
   index.js

这里我想从App.js导入layout.js文件。我的代码是

import React from 'react';
import Layout from './components/layout';

class App extends React.Component{
   render(){
       return ( 
          <div>
              <p>Hi</p>
          </div>
      );
   }
 }

 export default App;

在我的代码中，如何导入 layout.js 文件？

Answer 1

理想情况下，您的布局是一个可以简单地导入到 main.js 中的组件。创建新组件时的一个好习惯是在组件文件夹中创建一个单独的文件夹并创建index.js。通过这样做，您可以导入如下所示的组件:

/src
/components
  /layout
    index.js
App.js
index.css
index.js



import React from 'react';
import Layout from './components/layout';

class App extends React.Component{
   render(){
       return ( 
          <div>
              <p>Hi</p>
              <Layout/>
          </div>
      );
   }
 }

 export default App;