ES6 ReactJS 警告：React.createElement：类型不应为 null、未定义、布尔值或数字

Question

我在开发 ReactJS 组件时遇到了一个奇怪的问题，一切正常，但是当我尝试在 ContentBody 中呈现我的 UserPage 组件时出现此错误

react.js:18798 警告：React.createElement：类型不应为空， 未定义、布尔值或数字。它应该是一个字符串（对于 DOM 元素）或 ReactClass（用于复合组件）。

user.jsx 组件

import Link from ‘react’


export default class UserPage extends React.Component {
    function render() {
         return(
             <UserList />  
         );
    }
}

class UserList extends React.Component {
    function render() {
        return(
           {/* jsx code */}
        );
    }
}

class User extends React.Component {
    function render() {
      return(
        <tr>

            <td>{user.name}</td>
            <td>{user.email}</td>
            <td>{user.createdAt}</td>
            <td>{user.updatedAt}</td>
            <td>
                <Link to="/api/user/delete">Delete</Link>
            </td>
        </tr>
    );
    }
}

##########################################
content-body.jsx file
/*————————————–-----------------*/
import UserPage from ‘./page/user.jsx’;

export default class ContentBody extends React.Component {

    constructor(props) {
       super(props)
       this.state = {data: []};
    }

    render() {
        return(

           {/* This should be dynamic and replaced with Router */}

       );
    }
}

它仍然会抛出那个错误，不知道我在这里做错了什么？

更新 我能够通过正确导入链接来解决问题，因为链接不是导出默认链接，它应该导入为

import {Link} from 'react'

Answer 1

react 包的默认导出不是Link，因此您必须显式导入Link。

import { Link } from "react";

---

如果您不想这样做，请导入所有react：

import * as React from "react";

然后正确引用Link：

<React.Link to="/api/user/delete">Delete</React.Link>