Отключить React.createClass и PropTypes устаревшие предупреждения в действии babel

В последнем случае пакет React 15.5.1, если при использовании babel реагируют на разрешение файла jsx, появятся следующие предупреждения:

Warning: Accessing PropTypes via the main React package is deprecated. Use the prop-types package from npm instead.

warning.js:36 Warning: A Component: React.createClass is deprecated and will be removed in version 16. Use plain JavaScript classes instead. If you're not yet ready to migrate, create-react-class is available on npm as a drop-in replacement.

Мой код следующий:

import React from 'react'
import ReactDOM from 'react-dom';

class Counter extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      count: 1
    }
  }
  componentDidMount() {
    setInterval( ()=> {
      this.setState((prevState, props) => ({
        count: prevState.count + 1
      }))
    }, 1000)
  }
  render(){
    return (
      <h1>{this.state.count}</h1>
    )
  }
}

const root = document.createElement('div');
root.id = 'app';
document.body.appendChild(root);

ReactDOM.render(
  <Counter />,
  document.querySelector('#app')
);

Я не использую React.createClass и PropTypes в своем коде, кажется, что babel преобразует мой код в React.createClass и PropTypes, как это исправить?

Ответы

Ответ 1

React 15.5.0 содержит новые предупреждения, относящиеся к изменениям, которые появляются в React 16, предупреждение, которое вы получаете, на самом деле говорит вам, что вы должны реализовать новый способ (поскольку текущий способ, которым вы пользуетесь, будет устаревшим на 16).

React.createClass, у вас есть 2 варианта, сначала нужно просто использовать простой синтаксис JS:

function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}

или используйте модуль create-react-class (доступно на npm):

// Before (15.4 and below)
var React = require('react');

var Component = React.createClass({
  mixins: [MixinA],
  render() {
    return <Child />;
  }
});

// After (15.5)
var React = require('react');
var createReactClass = require('create-react-class');

var Component = createReactClass({
  mixins: [MixinA],
  render() {
    return <Child />;
  }
});

О предупреждении PropTypes, проверьте, используете ли вы модуль, который использует PropTypes, иногда он поступает из внешней части.

В любом случае, чтобы больше узнать об этом, вы можете получить сообщение в блоге Facebook об этих изменениях

Ответ 3

React.createClass и React.PropTypes устарели в версии 15.5.

Некоторые зависимости/зависимости должны использовать React.createClass и React.PropTypes с React:^15.4 (или любой другой версией), которая очень совместима с вашей реакционной версией. Так что получите предупреждение о наличии кода.

Пожалуйста, обратитесь эта ссылка для 15.5 Изменения

https://facebook.github.io/react/blog/2017/04/07/react-v15.5.0.html

Ответ 4

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

import * as React from 'react'

изменив это на

import React from 'react'

устраняет предупреждения

Ответ 5

Это не ответ, просто добавьте еще одну вещь, поскольку я еще не могу прокомментировать:-( Может быть, у кого-то еще такая же проблема с реакцией-бутстрапом

Я получил то же самое при использовании реакционной бутстрапа 0.30.8 вместе с реакцией 15.5.3

Предупреждение: неконтролируемое (выпадающее меню): React.createClass устарела и будет удалена в версии 16. Вместо этого используйте простые классы JavaScript. Если вы еще не готовы к миграции, класс create-react доступен на npm в качестве замены.

я вхожу: uncontrollable/createUncontrollable.js --- > 

var component = _react2.default.createClass(_extends({

[email protected] - это откат реакции-бутстрапа 0.30.8

и

Предупреждение. Доступ к PropTypes через основной пакет React устарел. Вместо этого используйте пакет prop-types из npm.

response-bootstrap/es/PanelGroup.js --- > 

accordion: React.PropTypes.bool

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

Ответ 6

Вы не должны расширять реакцию. Компонент. Вам нужно импортировать компонент из реакции и расширить его, показанный здесь:

  import React, {Component} from 'react';

  class Counter extends Component{
  //your code here
  render (){

    return (
       <h1>{this.state.count}</h1>
    );
   }
}

Вы можете прочитать о различиях и классах ES6 здесь