我目前有我的项目文件夹
app
- node_modules
- public
- src
- Assets
- Components
- profiles
- homepage
- gulpfile
在我的主页组件中,我尝试将配置文件的整个目录导入到这样的对象中(根据需要动态加载每个组件,但并非所有组件都会加载)
import Comps from '../profiles/';
还有
import * as Comps from '../profiles/;
但我在编译器中收到错误消息“找不到模块:无法解析'../profile”。
我想明确的是,profiles 是一个包含组件的文件夹,我想选择所有组件在我的 app.js 文件中动态调用。
为什么会发生这种情况?
最佳答案
一个 js 文件中是否有多个组件,如果是的话 - 您可以执行以下操作:
配置文件.js:
import React from 'react';
export const ViewA = () => {
return( <div>A VIEW</div>)
};
export const ViewB = () => {
return( <div>B VIEW</div>)
};
export const ViewC = () => {
return( <div>C VIEW</div>)
};
export const ViewD = () => {
return( <div>D VIEW</div>)
};
应用程序.js:
import React, { Component, PropTypes } from 'react'
import * as Profiles from './Profiles';
class App extends Component {
render(){
return (
<div>
<Profiles.ViewA/>
<Profiles.ViewB/>
<Profiles.ViewC/>
</div>
)
}
}
export default App;
关于reactjs - React 导入组件文件夹,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48553994/