Question

我已经在React Class组件中创建了一个静态方法当我通过道具时，在我看来，它们并没有通过，但是，孩子们的支持通过没有任何问题 component calling

这是组件和给定的道具当安慰我收到不确定的！ The Component

class Tabel extends Component {
static Head = ({ children, ...props }) => (
    <span className="table-head">
        {children}
    </span>
)

static Body = ({ children, ...props }) => (
    <div className="tabel-body">{children}</div>
)

render = () => (
    <div className='tabel-container' >
        {this.props.children}
    </div>
)

}

我正在传递像这样的道具

<Tabel.Cell
  mainContent='$10 175.00'
  subContent={{ content: '12.4%', classes: 'stock-up' }}
/>

Answer 1

您可以散布道具，这不应该成为问题：

class Tabel extends Component {
static Head = ({ children, ...props }) => (
    <span className="table-head"  {...props}>
        {children}
    </span>
)

static Body = ({ children, ...props }) => (
    <div className="tabel-body" {...props} >{children}</div>
)

render = () => (
    <div className='tabel-container' >
        {this.props.children}
    </div>
)

}

Answer 2

可以这样尝试

static Head = props => (
    <span className="table-head">
        {props.children}
        {props.prop1Name}
        {props.prop2Name}
    </span>
)

将道具传递给静态React组件

2 个答案: