当前位置: 动力学知识库 > 问答 > 编程问答 >

reactjs - react-absolute-grid, displayObject issue

问题描述:

I am trying to use this component: https://github.com/jrowny/react-absolute-grid.

The documentation says I should pass a displayObject which renders items.

So I created a displayObject, like the one in the docs which has this render method:

 render: function() {

// Supposing your item shape is something like {name: 'foo'}

const { item, index, itemsLength } = this.props;

return <div>Item {index} of {itemsLength}: {item.name}</div>;

}

I passed it to the component like this:

<AbsoluteGrid

items={SampleData.screens}

displayObject={<DisplayObject/>}

onMove={onMoveDebounced}

dragEnabled={true}

responsive={true}

verticalMargin={42}

itemWidth={250}

itemHeight={250}

filteredProp={'name'}

/>

Where SampleData.screens is:

module.exports = {

screens: [

{'url': 'http://invisionapp.com/subsystems/do_ui_kit/assets/img/screens/original-1x/screen-1-1-login.jpg', 'name': 'login', 'sort': 1, 'key': 1},

{'url': 'http://invisionapp.com/subsystems/do_ui_kit/assets/img/screens/original-1x/screen-1-2-sign-up.jpg', 'name': 'signup', 'sort': 2, 'key': 2},

{'url': 'http://invisionapp.com/subsystems/do_ui_kit/assets/img/screens/original-1x/screen-1-3-walkthrough.jpg', 'name': 'walkthrough', 'sort': 3, 'key': 3}

]

};

When I open the page in the browser, I don't see the text from the displayObject.

How can I use the displayObject?

分享给朋友:
您可能感兴趣的文章:
随机阅读: