Question

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

react.js：18798警告：React.createElement：type不应为null， undefined，boolean或number。它应该是一个字符串（对于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>

ES6 ReactJS警告：React.createElement：type不应为null，undefined，boolean或number

user.jsx组件

1 个答案: