componentWillReceiveProps был переименован

Я использую Material ui SwipeableViews, которые используют пакет ReactSwipableView, я получаю эту ошибку на консоли

react-dom.development.js: 12466 Предупреждение: componentWillReceiveProps был переименован и не рекомендуется для использования. Смотрите подробности.

• Переместите код выборки данных или побочные эффекты в componentDidUpdate.
• Если вы обновляете состояние каждый раз, когда изменяется реквизит, реорганизуйте свой код для использования методов запоминания или переместите его в статический getDerivedStateFromProps. Узнайте больше на:
• Переименуйте componentWillReceiveProps в UNSAFE_componentWillReceiveProps, чтобы отключить это предупреждение в нестрогом режиме. В React 17.x будет работать только имя UNSAFE_. Чтобы переименовать все устаревшие жизненные циклы в их новые имена, вы можете запустить их npx react-codemod rename-unsafe-lifecyclesв исходной папке вашего проекта.

Пожалуйста, обновите следующие компоненты: ReactSwipableView

Есть ли способ избавиться от этой ошибки, я попробовал UNSAFE_componentWillReceiveProps, но ничего не изменилось

Похоже, об этом уже сообщили сопровождающим.

Теперь, как пользователь программного обеспечения с открытым исходным кодом, вы можете:

• ждать, пока они исправят (или не исправят) проблему
• будь крут и представь пиар, чтобы исправить это для них :) Вот все ссылки componentWillReceivePropsна репо
• найти новый пакет для использования

В конечном счете, это не ошибка, связанная с вашим программным обеспечением, а зависимости, от которых оно зависит. Это не ваша ответственность, чтобы исправить это. Если ваше приложение работает, все будет хорошо. Предупреждения от react-dom.development.jsне появятся в производстве.

Используйте getDerivedStateFromPropsвместоcomponentWillReceiveProps

Например:

Перед:

// Before
class ExampleComponent extends React.Component {
  state = {
    isScrollingDown: false,
  };

  componentWillReceiveProps(nextProps) {
    if (this.props.currentRow !== nextProps.currentRow) {
      this.setState({
        isScrollingDown:
          nextProps.currentRow > this.props.currentRow,
      });
    }
  }
}

После:

// After
class ExampleComponent extends React.Component {
  // Initialize state in constructor,
  // Or with a property initializer.
  state = {
    isScrollingDown: false,
    lastRow: null,
  };

  static getDerivedStateFromProps(props, state) {
    if (props.currentRow !== state.lastRow) {
      return {
        isScrollingDown: props.currentRow > state.lastRow,
        lastRow: props.currentRow,
      };
    }

    // Return null to indicate no change to state.
    return null;
  }
}

https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html

У меня были проблемы с поиском, где в моем коде вызывался componentWillReceiveProps. Я заметил в предупреждении, что в нем упоминается определенный компонент, «Drawer», который был частью библиотеки ant-d, которую мы используем. После обновления ant-d до последней версии предупреждение исчезло.

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

• Сначала установите lodash в директорию вашего собственного реактивного проекта, т.е.

npm i --save lodash

-после того, как написать следующий код в вашем файле .js:

    import { YellowBox } from 'react-native';
    import _ from 'lodash';

    YellowBox.ignoreWarnings(['componentWillReceiveProps']);
    const _console = _.clone(console);
    console.warn = message => {
    if (message.indexOf('componentWillReceiveProps') <= -1) {
     _console.warn(message);
    } 
   };