Pregunta Deshabilitar React.createClass y PropTypes advertencias obsoletas en Babel reaccionar presente


En el último paquete de React 15.5.1, si usa babel reaccionar presente para resolver el archivo jsx, aparecerá después de las advertencias:

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.

Mi código es siguiente:

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')
);

No estoy usando React.createClass y PropTypes en mi código, parece que babel transforma mi código en React.createClass y PropTypes, ¿Cómo arreglar eso?


32
2018-04-08 01:52


origen


Respuestas:


React 15.5.0 contiene nuevas advertencias que pertenecen a los cambios que están apareciendo en React 16, la advertencia que está recibiendo, en realidad le está diciendo que debe implementar la nueva forma (ya que la forma actual que está utilizando va a ser en desuso en 16).

React.createClass, tienes 2 opciones, la primera es usar simplemente la sintaxis JS:

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

o usa el create-react-class módulo (disponible en 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 />;
  }
});

Acerca de la advertencia PropTypes, compruebe si está utilizando un módulo que usa PropTypes, a veces proviene de una parte externa.

De todos modos, para leer más al respecto, le invitamos a obtener Publicación en el blog de Facebook sobre esos cambios


11
2018-04-13 18:21



Reaccionar v15.5.0 implementos nuevas advertencias

La degradación reacciona a 15.4.x funciona para mi

npm install --save react@15.4.0 react-dom@15.4.0

5
2018-04-08 16:12



React.createClass y React.PropTypes ha quedado obsoleto en v15.5.

Algunos pares / dependencias deben estar usando React.createClass y React.PropTypes con React:^15.4 (o cualquier otra versión), que es muy compatible con su versión de reacción. Entonces, obteniendo una advertencia para su código.

Consulte este enlace  para 15.5 cambios

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


4
2018-04-08 13:58



Encontré que la advertencia estaba presente porque estaba importando Reaccionar con

import * as React from 'react'

cambiando esto a

import React from 'react'

hace que las advertencias desaparezcan


3
2017-09-23 14:57



Esta no es una respuesta, solo una cosa más para agregar, ya que aún no puedo comentar :-( Tal vez alguien más tenga el mismo problema con reaccionar-bootstrap

Obtuve lo mismo al usar reaccionar-bootstrap 0.30.8 junto con reaccionar 15.5.3

Advertencia: no controlado (menú desplegable): React.createClass está en desuso y se eliminará en la versión 16. En su lugar, use clases simples de JavaScript. Si aún no está listo para migrar, create-reaction-class está disponible en npm como un reemplazo directo.

entro: incontrolable / createUncontrollable.js --->

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

uncontrollable@4.0.3 es una dep de reaccionar-bootstrap 0.30.8

y

Advertencia: El acceso a PropTypes a través del paquete principal de React está en desuso. Use el paquete prop-types de npm en su lugar.

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

accordion: React.PropTypes.bool

Creo que la degradación de reaccionar es la única forma de solución aquí, ya que reaccionar-bootstrap aún no es lo suficientemente lejos.


0
2018-04-08 15:28



No deberías estar extendiendo react.Component. Debe importar Component from reaccionar y extenderlo que se muestra aquí:

  import React, {Component} from 'react';

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

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

Puedes leer sobre las diferencias y las clases de ES6 aquí


-4
2018-04-08 13:48