除了一些关于一些基本知识的教程之外,我对做出反应是完全陌生的,所以我觉得我在这里陷入了一些深渊。
我正在尝试使用 gridStack 并找到了一个漂亮的包装器供它在 React 中使用。我已经设法让所有依赖项启动并运行,但现在遇到了一个我无法解决的错误:
this.cellHeight is not a function(...)
. 我一直在寻找负载以尝试理解为什么没有定义它,因为我正在关注他们在此处找到的网站上的基本添加。
我不得不对其进行一些修改以使其发挥出色,因为我已经减少了所有错误并发现这是我无法理解的最后一个错误。任何帮助将不胜感激。
import React from 'react';
import GridStack from 'gridstack';
import {GridStackItem} from 'react-gridstack';
class MyGrid extends React.Component{
render(){
return(
<GridStack cellHeight={50} vertical={10}>
<GridStackItem id='item_1' x={0} y={0} minHeight={2} minWidth={2}>
First Item
</GridStackItem>
<GridStackItem id='item_2' x={0} y={2}>
Second Item
</GridStackItem>
</GridStack>
);
}
}
export default MyGrid;
然后通过我的 App 类应用该组件
import React, {Component, PropTypes} from 'react';
import ReactDOM from 'react-dom';
import $ from 'jquery';
import Bootstrap from 'bootstrap/dist/css/bootstrap.css';
import MyGrid from './gridstack.jsx';
window.$ = $;
class App extends React.Component {
render() {
return(
<div>
<p>Hello WORLD!!!!</p>
<MyGrid/>
</div>
)
}
}
ReactDOM.render(<App/>, document.getElementById('root'));
当我在 React 中找到自己的脚时,你可以看到这是所有基本的第一步。