Question

我已经为我的项目安装了react-router-dom并调整了index.js文件以支持它，但是由于某种原因，它破坏了我的应用程序。这是完整的错误消息：

错误：元素类型无效：预期为字符串（对于内置组件）或类/函数（对于复合组件），但得到了：对象。您可能忘记了从定义文件中导出组件，或者可能混淆了默认导入和命名导入。检查App的渲染方法。

这是在错误报告中突出显示的方式：

  5 | import * as serviceWorker from './serviceWorker';
   6 | import { BrowserRouter as Router } from "react-router-dom";
   7 | 
>  8 | ReactDOM.render(
   9 |   <Router>
  10 |     <App />
  11 |   </Router>,

这是我的App.js文件：

import React, { Component } from 'react';
import { Route } from "react-router";
import './App.css';
import PropTypes from 'prop-types';
import HeaderMenu from './components/HeaderMenu'
import MainPage from './components/MainPage'
import Works from './components/Works'
import Info from './components/Info'
import Contact from './components/Contact'

export default class App extends Component {
  state = {
    userView: 0
  }

  handleChange = (userView) => {
    userView === 0 ? this.setState({ userView: 1}) : this.setState({ userView: 0})
  }

  render() {
  return (
    <div className="App">
      <HeaderMenu
        handleChange={this.handleChange}
        userView={this.state.userView}
      />
      <Route
        exact
        path="/"
        render={() => (
          <MainPage />
        )}
      />
      <Route
        exact
        path="/works"
        render={() => (
          <Works />
        )}
      />
      <Route
        exact
        path="/info"
        render={() => (
          <Info />
        )}
      />
      <Route
      exact
      path="/contact"
      render={() => (
        <Contact/>
      )}
    />
    </div>
  );
  }
 }

 App.propTypes = {
  userView: PropTypes.oneOf([0, 1]).isRequired
}

这是我的index.js文件：

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
import { BrowserRouter as Router } from "react-router-dom";

ReactDOM.render(
  <Router>
    <App />
  </Router>,
  document.getElementById('root')
);

Answer 1

进行以下必要更改：

LinearPercentIndicator(
                  width: MediaQuery.of(context).size.width - 50,
                  animation: true,
                  lineHeight: 25.0,
                  animationDuration: 2500,
                  percent: percentage,
                  center: Text(message),
                  linearStrokeCap: LinearStrokeCap.roundAll,
                  progressColor: progressColor,
                ),

在底部添加导出默认应用程序，并使用 Switch

包装到 Route

我无法解决此错误：请检查“ App”的渲染方法

1 个答案: