Pertanyaan Nonaktifkan React.createClass dan PropTypes peringatan yang ditinggalkan di babel bereaksi sekarang


Pada paket React 15.5.1 terbaru, Jika menggunakan babel bereaksi hadir untuk menyelesaikan file jsx, akan muncul peringatan berikut:

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.

Kode saya mengikuti:

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

Saya tidak menggunakan React.createClass dan PropTypes dalam kode saya, Sepertinya babel mengubah kode saya menjadi React.createClass dan PropTypes, Bagaimana cara memperbaikinya?


32
2018-04-08 01:52


asal


Jawaban:


Bereaksi 15.5.0 berisi peringatan baru milik perubahan yang datang pada React 16, peringatan yang Anda dapatkan, sebenarnya memberitahu Anda bahwa Anda harus menerapkan cara baru (karena cara saat ini yang Anda gunakan akan menjadi tidak berlaku lagi pada 16).

React.createClass, Anda memiliki 2 opsi, pertama adalah hanya menggunakan sintaks JS biasa:

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

atau gunakan create-react-class modul (tersedia pada 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 />;
  }
});

Tentang peringatan PropTypes, periksa apakah Anda menggunakan modul yang menggunakan PropTypes, kadang-kadang berasal dari bagian eksternal.

Bagaimanapun, untuk membaca lebih lanjut tentang itu, Anda dipersilakan untuk mendapatkannya Posting blog Facebook tentang perubahan itu


11
2018-04-13 18:21



Reaksi v15.5.0 mengimplementasikan peringatan baru

Mengurangi Reaksi menjadi 15.4.x bekerja untukku

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

5
2018-04-08 16:12



React.createClass dan React.PropTypes telah dihentikan di v15.5.

Beberapa Peer / ketergantungan harus digunakan React.createClass dan React.PropTypes dengan React:^15.4 (atau versi lain), yang sangat kompatibel dengan versi reaksi Anda. Jadi dapatkan Peringatan untuk kode di sana.

Silakan lihat Link ini  untuk 15,5 Perubahan

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


4
2018-04-08 13:58



Saya menemukan bahwa peringatan itu hadir karena saya mengimpor Bereaksi dengan

import * as React from 'react'

mengubah ini menjadi

import React from 'react'

membuat peringatan menghilang


3
2017-09-23 14:57



Ini bukan jawaban, hanya satu hal lagi untuk ditambahkan, karena saya belum dapat berkomentar :-( Mungkin orang lain memiliki masalah yang sama dengan bereaksi-bootstrap

Saya mendapat hal yang sama ketika menggunakan react-bootstrap 0.30.8 bersama dengan reaksi 15.5.3

Peringatan: Tidak terkontrol (Dropdown): React.createClass tidak lagi digunakan dan akan dihapus dalam versi 16. Sebagai gantinya, gunakan kelas-kelas JavaScript biasa. Jika Anda belum siap untuk bermigrasi, buat-reaksi-kelas tersedia di NPM sebagai pengganti drop-in.

saya masuk: uncontrollable / createUncontrollable.js --->

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

uncontrollable@4.0.3 adalah dep dari react-bootstrap 0.30.8

dan

Peringatan: Mengakses PropTypes melalui paket React utama tidak lagi digunakan. Gunakan paket prop-type dari npm sebagai gantinya.

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

accordion: React.PropTypes.bool

Menurut saya, merendahkan reaksi adalah satu-satunya cara untuk mengatasinya di sini, karena reaksi-bootstrap belum cukup jauh.


0
2018-04-08 15:28



Anda tidak boleh memperpanjang reaksi.Komponen. Anda perlu mengimpor Komponen dari reaksi dan memperpanjangnya telah ditunjukkan di sini:

  import React, {Component} from 'react';

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

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

Anda dapat membaca tentang perbedaan dan kelas ES6 sini


-4
2018-04-08 13:48