1

除了一些关于一些基本知识的教程之外,我对做出反应是完全陌生的,所以我觉得我在这里陷入了一些深渊。

我正在尝试使用 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 中找到自己的脚时,你可以看到这是所有基本的第一步。

4

0 回答 0