react/no-object-type-as-default-prop Perf
它的作用
禁止将对象、数组、函数、类、正则、JSX，或通过 new 构造的值 作为解构后的 React 组件 props 的默认值。
为什么这不好？
解构参数的默认值会在每次渲染时求值。当默认值是对象字面量、数组字面量、 函数表达式、类表达式、正则表达式、new 表达式或 JSX 元素时，都会在 每次渲染时创建一个新的引用。将这个新引用传递给子组件或 hook 依赖数组， 会破坏记忆化并导致不必要的重新渲染。
注意：如果使用 React Compiler，则不需要启用此规则，因为 React Compiler 会自动对默认值进行记忆化。
示例
以下是此规则的错误代码示例：
jsx
function Foo({ items = [] }) {
return <List items={items} />;
}
const Bar = ({ config = {} }) => <div data-config={config} />;
function Baz({ onClick = () => {} }) {
return <button onClick={onClick} />;
}以下是此规则的正确代码示例：
jsx
const DEFAULT_ITEMS = [];
function Foo({ items = DEFAULT_ITEMS }) {
return <List items={items} />;
}
const Bar = ({ name = "world" }) => <div>{name}</div>;
function Baz({ onClick }) {
return <button onClick={onClick} />;
}如何使用
To enable this rule using the config file or in the CLI, you can use:
json
{
"plugins": ["react"],
"rules": {
"react/no-object-type-as-default-prop": "error"
}
}ts
import { defineConfig } from "oxlint";
export default defineConfig({
plugins: ["react"],
rules: {
"react/no-object-type-as-default-prop": "error",
},
});bash
oxlint --deny react/no-object-type-as-default-prop --react-plugin版本
此规则在 vnext 中加入。