← Back to rules

react/no-danger-with-children 正しさ

何を実行するか

children と dangerouslySetInnerHTML プロパティの両方を使用する際、DOM 要素に対して禁止します。

なぜこれは良くないのか

このルールを無視し、children と dangerouslySetInnerHTML の両方を使用した場合、React は警告を表示します。

例

このルールに違反する 誤った 例:

<div dangerouslySetInnerHTML={{ __html: "HTML" }}>Children</div>;
React.createElement("div", { dangerouslySetInnerHTML: { __html: "HTML" } }, "Children");

このルールに従う 正しい 例:

<div>Children</div>
<div dangerouslySetInnerHTML={{ __html: "HTML" }} />

使用方法

設定ファイルまたは CLI でこのルールを 有効化 するには、次のように使用できます：

Config (.oxlintrc.json)

{
  "plugins": ["react"],
  "rules": {
    "react/no-danger-with-children": "error"
  }
}

CLI

oxlint --deny react/no-danger-with-children --react-plugin

参照

• ルールのソース