Мобильная версияКомпонент класса React внутри компонента Function не перерисовывается после изменения состояния. ⇐ Javascript
-
Гость
Компонент класса React внутри компонента Function не перерисовывается после изменения состояния.
99% моего приложения — это функциональные компоненты, но есть компонент устаревшего класса (MyPDF), вложенный в функциональный компонент (MyApp), который мне приходится использовать (это слишком много усилий, чтобы переписать класс как функцию). Существует значение состояния url, передаваемое компоненту класса из функционального компонента. Однако когда затем url изменяется в родительском функциональном компоненте, эти изменения не распространяются на компонент класса и не перерисовываются.
Компонент класса также написан на TypeScript, тогда как родительский функциональный компонент — на JavaScript, если это вообще имеет значение.
myapp.js
import React, { useState } из «реагировать»; импортировать MyPDF из «./mypdf.tsx»; функция MyApp() { const [url, setURL] = useState("https://initialpdf.com"); const onClick = () => { setURL("https://newpdf.com"); }; console.log("URL", URL); // этот URL меняется правильно возвращаться ( Это мое приложение PDF (функция): {url
Изменить URL ); } экспортировать MyApp по умолчанию;
mypdf.tsx
импортировать React из «реагировать»; Состояние интерфейса { URL: строка; } класс MyPDF расширяет React.Component { состояние = { URL: "" }; конструктор (реквизит: любой) { супер(реквизит); this.state.url = props.data; } оказывать() { return PDF (Класс): {this.state.url; // почему this.state.url не меняется? } } экспортировать MyPDF по умолчанию; Как заставить компонент класса повторно отображать и отслеживать изменения в родительском состоянии?
99% моего приложения — это функциональные компоненты, но есть компонент устаревшего класса (MyPDF), вложенный в функциональный компонент (MyApp), который мне приходится использовать (это слишком много усилий, чтобы переписать класс как функцию). Существует значение состояния url, передаваемое компоненту класса из функционального компонента. Однако когда затем url изменяется в родительском функциональном компоненте, эти изменения не распространяются на компонент класса и не перерисовываются.
Компонент класса также написан на TypeScript, тогда как родительский функциональный компонент — на JavaScript, если это вообще имеет значение.
myapp.js
import React, { useState } из «реагировать»; импортировать MyPDF из «./mypdf.tsx»; функция MyApp() { const [url, setURL] = useState("https://initialpdf.com"); const onClick = () => { setURL("https://newpdf.com"); }; console.log("URL", URL); // этот URL меняется правильно возвращаться ( Это мое приложение PDF (функция): {url
Изменить URL ); } экспортировать MyApp по умолчанию;
mypdf.tsx
импортировать React из «реагировать»; Состояние интерфейса { URL: строка; } класс MyPDF расширяет React.Component { состояние = { URL: "" }; конструктор (реквизит: любой) { супер(реквизит); this.state.url = props.data; } оказывать() { return PDF (Класс): {this.state.url; // почему this.state.url не меняется? } } экспортировать MyPDF по умолчанию; Как заставить компонент класса повторно отображать и отслеживать изменения в родительском состоянии?
