Использовать статическую лебедку без реакции с withRouter

Question

Как использовать hoist-non-react-statics с withRouter

Я добавляю статический метод в Feedback компонент.

Это был мой оригинальный код. Я пытаюсь использовать новые изменения в Context API (реагировать на 16.6)

Feedback.contextType = AppContext;

export default withRouter( Feedback );

Это работает нормально, но в консоли я получаю следующее предупреждение.

Предупреждение: withRouter (Feedback): функциональные компоненты не поддерживают contextType.

Итак, чтобы исправить предупреждение, я использовал метод, предложенный Даном здесь . Это также упоминается в реакции документы

Итак, у меня есть этот код, который не работает.

Импортировано hoist-non-react-statics

import {Link, withRouter} from 'react-router-dom';
import hoistNonReactStatics from 'hoist-non-react-statics';

И экспортировал компонент вот так

Feedback.contextType = AppContext;
hoistNonReactStatics( Feedback, withRouter(Feedback) );

export default Feedback;

, но по какой-то причине информация о маршрутизаторе (история, совпадение и т. Д.) Не заполняется в props

Какие-нибудь указатели, почему он не работает?

Answer 1

У меня было это предупреждение с использованием 'hoist-non-response-statics' и без него, и оно исчезло, когда я обновил реакцию-router-dom до последней версии (5.0.0)

Answer 2

Второй фрагмент не должен работать, потому что withRouter(Feedback) не экспортируется из модуля.

Как объясняет связанная проблема , проблема заключалась в том, что hoist-non-react-statics не обрабатывалось contextType статическим свойством правильно. Это было исправлено в последней версии hoist-non-react-statics. Поскольку react-router использует более старую версию hoist-non-react-statics в качестве зависимости, это можно исправить на месте:

Feedback.contextType = AppContext;

export default Object.assign(withRouter(Feedback), { contextType: undefined });

Или:

Feedback.contextType = AppContext;

const FeedbackWithRouter = withRouter(Feedback);
delete FeedbackWithRouter.contextType;
export default FeedbackWithRouter;

Или:

export default withRouter(Feedback);

Feedback.contextType = AppContext;