同时使用 props.children 和默认参数

Question

我在功能组件 (React.js v17.0.2) 中使用默认参数时遇到问题。我有上面的组件，它接收具有默认值的特定参数。我怎样才能让这个组件在使用 MyComponent(props){...} 时仍然能够接收道具？更具体地说，我怎样才能让这个组件能够接收 props.children?

export default function Box({style = "red-box"}, {size="xl"} ) {
console.log(props)
return (
    <div className={`${style} ${size}`}>
        {props.children} <----
    </div>
)}

希望思路清晰。提前致谢！

Answer 1

这够吗？

export default function Box({children, size="xl", style="red-box"}) {
return (
    <div className={`${style} ${size}`}>
        {children}
    </div>
)}

同时使用 props.children 和默认参数

Using both props.children and default Parameters

javascript

reactjs

jsx

react-props