gpt4 book ai didi

javascript - React.createElement : type should not be null, 未定义、 bool 值或数字。它应该是一个字符串(对于 DOM 元素)...;使用固定数据表 CDN

转载 作者:行者123 更新时间:2023-12-03 05:07:08 25 4
gpt4 key购买 nike

我有一个 React 应用程序出现错误

Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components). Check the render method of BasicDataTableExample.

Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. Check the render method of BasicDataTableExample.

我位于 https://facebook.github.io/fixed-data-table/getting-started.html创建您的栏部分

区别在于我使用的是 CDN,而他们使用的是

const {Table, Column, Cell} = require('fixed-data-table');

相反。

我尝试像 const Table = FixDataTable.Table; 那样解包,当我进入调试器时,这似乎可以工作,但应用程序已损坏。它看起来像:

<!DOCTYPE html>
<html>

<head>
<title>data-table-basic</title>
<script src="https://unpkg.com/react@15.3.2/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15.3.2/dist/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-router/4.0.0-beta.3/react-router.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/fixed-data-table/0.6.3/fixed-data-table.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/fixed-data-table/0.6.3/fixed-data-table.min.css" rel="stylesheet">
<head>


<body>
<a class="nav-link" href="/clock">clock</a>
<a class="nav-link" href="/counter">counter</a>
<a class="nav-link" href="/data-table-basic">data-table-basic</a>
<a class="nav-link" href="/query-params-react-router">query-params-react-router</a>
<a class="nav-link" href="/todo-list">todo-list</a>
<a class="nav-link" href="/validated-form">validated-form</a>



<div id="entry"></div>
<div id="code"></div>

<script type="text/babel">
var destination = document.querySelector("#entry");

const Table = FixedDataTable.Table;
const Column = FixedDataTable.Column;
const Cell = FixedDataTable.cell;


class BasicDataTableExample extends React.Component {
constructor(props) {
super(props);

this.state = {
myTableData: [
{name: 'Rylan'},
{name: 'Amelia'},
{name: 'Estevan'},
{name: 'Florence'},
{name: 'Tressa'},
],
};
}

render() {
return (
<Table
rowsCount={this.state.myTableData.length}
rowHeight={50}
headerHeight={50}
width={1000}
height={500}>
<Column
header={<Cell>Name</Cell>}
cell={props => (
<Cell {...props}>
{this.state.myTableData[props.rowIndex].name}
</Cell>
)}
width={200}
/>
</Table>
);
}
}

ReactDOM.render(
<div>
<BasicDataTableExample/>
</div>,
destination
)

</script>
</body>

</html>

如何使 TableColumnCell 像使用 cdn 一样正确显示?

最佳答案

这里的问题可能是 Cell未定义,因为您试图将其检索为

const Cell = FixedDataTable.cell;

,而属性以大写 C 开头:

const Cell = FixedDataTable.Cell;

关于javascript - React.createElement : type should not be null, 未定义、 bool 值或数字。它应该是一个字符串(对于 DOM 元素)...;使用固定数据表 CDN,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41966131/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com