React/JSX を使用して、スタイルが読み込まれる前に React が読み込まれるのを待つにはどうすればよいですか?

Question

js/jsx/react を使用しているときにこの問題が発生し続けます。ページが読み込まれる前にロジックが実行されているため、何が自分のコードではないかに関するエラーが発生し続けます。ページの読み込みが完了する前に実行しようとすると、エラーが多い。

これを常に防ぎ、これらの問題から身を守るにはどうすればよいですか?

一連の window.onload() 関数を使用してみましたが、それは正しく感じられず、これを行うためのより良い方法があるはずだと感じていますが、グーグルや検索で見つけることができません。フォーム上で。< !-- p-->

// 私の問題の例は、次のコードの一貫したエラーです。
関数タイトル() {
    var text = "こんにちは";
    var arr = [];
    //単語を文字の配列に変換します
    for (let i=0; i<=text.length; i ){
        console.log("ループ")
        arr.push(text.charAt(i));
    }
    //各文字をスパンに出力します
    const listItems = arr.map((number) => <span>{number}</span>);

//どちらも機能しません
    // document.getElementById('title').style.color = ('rgba(0, 0, 0, 0.0)');
    // document.getElementById('title').style.color = "#ffFFff"

    戻る （
        <h1 id='title'>{listItems}</h1>
    )
}

私がよく遭遇するバグは、変更/アクセスしようとしている jsx で宣言されたスタイルが「存在しない」と反応するというものですが、ブラウザのコンソールで変更しようとすると正常に動作します。< /p>

Answer 1

React 要素にインライン スタイルを追加するには、style 属性を使用する必要があります。それで：＃＃＃ リーリー

コンポーネント本体にレンダリングされた DOM 要素にはアクセスできません。この目的には ref と

useEffect を使用する必要があります。