Пересоздается компонент, вызываемый Route

Есть <Route path="/edit/:id" component={EditorControl} /> (Пробовал и в свитч оборачивать, и без) Сам компонент - Tiny Mce

`const fetchJson = async (url : string) => {
    console.log("WTF")
    const response = await fetch(url);
    let json = response.json();
    return json;
};

type TParams = {
    id?: string;
}
const EditorControl  = ({match} : RouteComponentProps<TParams>) => {
    const [template, setTemplate] = useState(new TemplateData())
    console.log("mid", JSON.stringify(match))
    useEffect( () => {
      fetchJson('http://myurl/'+match.params.id)
            .then(result => {
                setTemplate(result as TemplateData)
            })
            .catch((e) => console.log(e));
    });
    //let tt = plainToClass(TemplateData, a);
    let tempText = template.value
     console.log(tempText)
    return (
        <div className={s.EditorPage}>
            <Editor
                value={tempText}

                init={{
                    className: s.Editor,
                    height: 830,
                    menubar: false,
                    plugins: [
                        'advlist autolink lis1ts link image charmap print preview anchor',
                        'searchreplace visualblocks code fullscreen',
                        'insertdatetime media table paste code help wordcount'],
                    toolbar:
                        'undo redo | formatselect | bold italic backcolor | \
                        alignleft aligncenter alignright alignjustify | \
                        bullist numlist outdent indent | removeformat | help'

                }}
            />
        </div>
    );`

У меня происходит постоянное пересоздание компонента. Почему и как исправить?


Ответы (1 шт):

Автор решения: Dmitrii Sedov

Так происходит потому что useEffect вызывается всегда когда происходит rerender компонента (получается аналог componentDidUpdate). В результате получается так: ajax ->rerender->ajax->rerender.... в useEffect добавляйте проверку загружены ли данные.

→ Ссылка