首页 > 解决方案 > 导入函数反应组件时出错

问题描述

我在反应中有一个函数组件,它得到一些道具如下:

export default function ThermoBreastCancerIntroPage(props) {
  console.log('rest is logged in is')
  console.log(props.is_logged_in);
  const [is_logged_in, set_is_logged_in] = useState(props.is_looged_in);
  const [fname, set_fname] = useState(props.fname);
  const [lname, set_lname] = useState(props.lname);

在我的 index.js 中,我导入它然后想使用它

import ThermoBreastCancerPage from "views/LandingPage/ThermoBreastCancerPage.js";

    ReactDOM.render(
      <Router history={hist}>
        <Switch>
           
          <Route path="/thermo-breast-cancer" component={<ThermoBreastCancerPage is_logged_in='false' fname='' lname='' />} />
        </Switch>
      </Router>

但在上面,我得到了错误

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

当我更改为 component={ThermoBreastCancerPage} 时,我不会收到任何错误,但我必须以某种方式传递道具。我是新手,不知道我做错了什么?

标签: reactjs

解决方案


你可以尝试改变这个

<Route path="/thermo-breast-cancer" component={<ThermoBreastCancerPage is_logged_in='false' fname='' lname='' />} />

对此

<Route path="/thermo-breast-cancer">
  <ThermoBreastCancerPage is_logged_in='false' fname='' lname='' />
</Route>

推荐阅读