☰

ESLintルールの「react/no-unescaped-entitie」違反を修正するにはどうすればいいでしょうか? 質問する

tag-icon • tag-icon reactjs eslint eslint-config-airbnb
ESLintルールの「react/no-unescaped-entitie」違反を修正するにはどうすればいいでしょうか? 質問する

これが私のコードです:

const func = () => {
  return (
    <div >
       you're free
      </div>
  )}

どういうわけか、ESLint は「you're free」という行にエラーフラグを立てますerror HTML entities must be escaped react/no-unescaped-entities

しかし、私が見る限り、JSX はすでにアポストロフィをエスケープしています。 という単語はyou're free問題なくレンダリングされていることがわかります。 としてエスケープすると&#39;、文字列を検索するのが非常に難しくなります (エディターで を検索するとyou're freeヒットが返されると予想されます。しかし、テキストは実際には であるため、エディターは明らかに検索しませんyou&#39;re free)。

では、この ESLint 例外に対処する最善の方法は何でしょうか?

ベストアンサー1

推奨される解決策は、変数としてラップする代わりに&apos;、&lsquo;または を使用することです。つまり、次のようになります。&rsquo;

const func = () => {
  return (
    <div >
       you&apos;re free
      </div>
  )}

検索性を高めるために、ローカリゼーション/国際化用のファイルを用意し、アプリ内で呼び出すことをお勧めします。

おすすめ記事