不包含名为的导出

时间:2018-04-10 02:10:12

标签: javascript reactjs

我正在尝试将一个简单的组件导入到我的React中。我无法找到这个组件。

导入组件时出现以下错误

  

./ src / App.js 61:28-32'./componentes/Menu'不包含导出   名为“菜单”。

这是我的简单组成部分:

import React, { Component } from 'react';

import { Button } from 'react-bootstrap';

export default class Menu extends Component {

    render() {
        return (
            <div>
            <Button bsStyle="danger">Hello World Dangerhahahah</Button>
          </div>
        );
    }

}

我在我的App中将其称为如下。

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';

import { Menu } from './componentes/Menu';

import { Button } from 'react-bootstrap';

class App extends Component {

  constructor(props) {
    super(props)
  }

render() {
    return (
      <div>
        <Menu />
        <Button bsStyle="danger">Take this action</Button>
        <div className="App">

          <div className="bs-header" id="content">
            <div className="container">
              <h1>Template Changelog</h1>
              <p>Lists all changes to the HTML template files</p>
            </div>
          </div>
        </div>
 );
  }
}

export default App;

3 个答案:

答案 0 :(得分:4)

这是因为你试图从文件中解构导出的默认组件。

只需从应用组件的import语句中移除Menu周围的括号,即import { Menu } from './componentes/Menu';变为import Menu from './componentes/Menu';

答案 1 :(得分:2)

在您使用的Menu.js export default中创建名为default的导出条目,无论类名是什么

你应该:

  1. import Menu from './components/Menu';
  2. 中使用App.js
  3. export class Menu extends Component
  4. 中使用Menu.js

答案 2 :(得分:1)

尝试将import { Menu } from './componentes/Menu';更改为import Menu from './componentes/Menu';