我正在为React Table写一个故事,我得到了以下错误:
React-toolbox文档未更新。我认为。因为我在the source code
中找不到model
和source
属性
有我的组件来源
import React from 'react'
import PropTypes from 'prop-types'
import styled from 'styled-components'
import {Table as RTTable} from 'react-toolbox/lib/table'
const Table = ({
...props
})=>
<RTTable {...props}></RTTable>
Table.propTypes = {
source: PropTypes.array,
model: PropTypes.object,
}
export default styled(Table)`
border: 1px solid;
`
我的故事来源:
import React from 'react'
import {storiesOf} from '@storybook/react'
import Table from 'Table'
const UserModel = {
name: {
type: String,
},
twitter: {
type: String,
},
birthdate: {
type: Date,
title: 'Date of Birth',
},
cats: {
type: Number,
},
dogs: {
type: Number,
},
active: {
type: Boolean,
},
}
const users = [
{
name: 'Javi Jimenez',
twitter: '@soyjavi',
birthdate: new Date(1980, 3, 11),
cats: 1,
}, {
name: 'Javi Velasco',
twitter: '@javivelasco',
birthdate: new Date(1987, 1, 1),
dogs: 1,
active: true,
},
]
storiesOf('Table', module).add('with source', ()=> <Table model={UserModel} source={users} />)
任何人都可以帮助我吗?我真的很感激。
答案 0 :(得分:0)
我更新了Component的代码:
import React from 'react'
import PropTypes from 'prop-types'
import {Table as RTTable, TableHead, TableCell} from 'react-toolbox/lib/table'
const Table = props=> {
const headerKeys = Object.keys(props.model)
return (
<RTTable>
<TableHead>
{
headerKeys.map((headerKey, index)=> <TableCell key={index}>{headerKey}</TableCell>)
}
</TableHead>
</RTTable>
)
}
Table.propTypes = {
model: PropTypes.object,
}
export default Table
故事书:
import React from 'react'
import {storiesOf} from '@storybook/react'
import Table from 'Table'
const UserModel = {
name: {
type: String,
},
age: {
type: Number,
},
}
storiesOf('Table', module).add('Init table', ()=> <Table model={UserModel}/>)
然后它有效。