React Bootstrap和React.PropTypes验证功能

React Bootstrap and React.PropTypes validation function

本文关键字:React 功能 验证 Bootstrap PropTypes      更新时间:2023-09-26

我有一个安装了browserifyreact-railsRails 5应用程序。我能够使用npm加载组件和安装软件包。加载一些外部包(即react-bootstrap组件(时,浏览器控制台中会填充"警告:您正在手动调用…的React.PropTypes验证函数。">用于组件上的每个可用道具。

我到处都找过了,但我不知道如何修复这些警告。这里也提出了类似的问题,但似乎没有适用于我的问题的答案。

这是我的文件:

package.json

{
  "name": "myapp",
  "version": "1.0.0",
  "dependencies": {
    "bootstrap": "^3.3.7",
    "browserify": "^13.1.0",
    "browserify-incremental": "^3.0.1",
    "fetch": "^1.1.0",
    "jquery": "^3.1.1",
    "jquery-ui": "^1.12.1",
    "jquery-ujs": "^1.2.2",
    "react": "^15.3.2",
    "react-bootstrap": "^0.30.4",
    "react-dom": "^15.3.2",
    "reactify": "^1.1.1",
    "sweetalert-react": "^0.4.4"
  }
}

application.js

//= require_self
//= require react-server
//= require react_ujs

window.$ = window.jQuery = global.$ = require('jquery');
var React = window.React = global.React = require('react');
var ReactDOM= window.ReactDOM = global.ReactDOM = require('react-dom');
require( 'jquery-ujs' );
require( 'jquery-ui' );
require( 'bootstrap' );
require( 'react-bootstrap' );
require( 'fetch' );
require( './components' );

components.js

var app = window.app = global.app = {};
// Component::Manifest
var AdminDashboard = require( 'components/dashboards/admin' );
app.AdminDashboard = AdminDashboard

admin.js.jsx

var ButtonToolbar = require('react-bootstrap').ButtonToolbar;
var Button = require('react-bootstrap').Button;
var Admin = React.createClass({
  handleClick(){
    alert('This was clicked');
  },

  render: function() {
    return (
      <ButtonToolbar bsClass="btn-group">
        <Button active={true} bsStyle="primary" onClick={this.handleClick}>Primary</Button>
      </ButtonToolbar>
  );
  }
});
module.exports = Admin;

如果此警告与外部程序包及其组件有关,我该如何消除它?

这可能会有所帮助-https://facebook.github.io/react/warnings/dont-call-proptypes.html.基本上,您使用react-bootstrap的库可能以React不支持的方式使用PropTypes

升级react引导程序应该可以解决此问题。看起来他们在6月份就解决了这个问题

您可以将您的package.json更改为"react-bootstrap": "^0.31.0",看看这是否适用于