Javascript 如何从defaultProps迁移到默认参数

我有一个

Loader

组件，它与

defaultProps

一起正常工作：

const-Loader=（{内部，外部，…rest}）=>{
返回(
);
};
Loader.defaultProps={
id:'加载器'，
内部：{
id:'内部'，
颜色：“黑色”
},
外部：{
id:'外部'，
颜色：“黑色”
}
};
ReactDOM.render（，document.getElementById（'root'））
如果您希望最外层的
id
位于
rest
中，我认为您不能这样做（因为您无法为rest目标定义默认值）。但是，如果接受最外层的
id
作为命名的非结构化参数，则可以通过在函数签名的非结构化中指定默认值，并为参数指定一个空白默认值作为其默认值来实现：

（不过，格式化确实很麻烦。：-）

实例：


const加载器=({
id='loader'，
内部={
id:'内部'，
颜色：“黑色”
},
外部={
id:'外部'，
颜色：“黑色”
},
休息
} = {}
) => {
返回(
);
};
ReactDOM.render（，document.getElementById（'root'））

对于可运行的示例，请使用现场堆栈片段，而不是非现场资源。堆栈代码段支持React，包括JSX。
const Loader = ({
         id = 'loader',       //
         inner = {            //
             id: 'inner',     //
             color: 'black'   //
         },                   // Various defaults for the destructuring
         outer = {            //
           id: 'outer',       //
           color: 'black'     //
         },                   //
         ...rest
    } = {}
//   ^^^^^---- default for the parameter itself
) => {
        // ...
};