Реактивный компонент не реагирует на смену реквизита

Question

Я использую реагировать нативно для разработки, и я использую функциональный компонент для разработки. но я сталкиваюсь с проблемой в этом. Поскольку я получаю обратный вызов от функции и сохраняю его в состоянии, и я хочу, чтобы этот компонент снова рендерился. но компонент не рендеринг снова. Пожалуйста, проверьте и предоставьте мне детали в

 callBackfn = (callback) => {
        this.setState({ infomationtosend: callback });                    
    }

, это работает нормально, как будто я распечатал его на консоли, чтобы получить правильное состояние вывода. но, как он снова идет в ComponentTreat, он не визуализирует компонент снова. Я также попытался использовать эффект, но не работает. Может ли кто-нибудь предоставить мне решение.

<Swiper
   from={0}
   >
    <ComponentTreat
           detailsend={this.state.infomationtosend}
           appName={"sentText"}
           CallBack={(callback) => this.callBackfn(callback)}
      />
 </Swiper>

проблема в Swiper Duw компонент Swiper не обновляет.

Answer 1

Изменение состояния функционального компонента работает следующим образом:

// Inside parent component
const [info, setInfo] = useState(initalValue);

Затем, чтобы использовать его в обратном вызове, мы используем замыкания для доступа к нему вместо использования ключевого слова this.

function callback(newValue) {
  setInfo(newValue);
}

И передайте его соответственно дочернему реквизиту.

Кроме того, извлеките useCallback () , если вы используете много обратных вызовов.