node.js - 路线未加载组件

Question

我的路线未加载我的组件。不确定什么地方工作不正常。如果我尝试使用其他组件，它可以正常工作，但不适用于该组件。

//routes.js

import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter, Route,Switch } from 'react-router-dom'
import { Meteor } from 'meteor/meteor';
import { RecoverPassword } from '../../ui/pages/recover-password';

Meteor.startup(() => {
ReactDOM.render((
<BrowserRouter>
    <Switch>
       <Route exect path="/" component={ RecoverPassword }/>
    </Switch>
 </BrowserRouter>
 ),
 document.getElementById('react-root')
);

//recoverpassword.js

import React from 'react';
export default class RecoverPassword extends React.Component {
constructor(props){
    super(props);
    console.log('hi');
}
render() {
  return(
    <h1>Hello</h1>
    );
  }
}

Answer 1

除了路线精确的拼写错误之外，

您正在导出默认模块:

export default class RecoverPassword ...

但是将其导入为命名导出:

import { RecoverPassword } from '../../ui/pages/recover-password';

您应该将其导入为默认值，因此将其更改为以下内容(无大括号):

import RecoverPassword from '../../ui/pages/recover-password';

您可以阅读有关 import/export 的更多信息 here和 here