Question

我看了react-bootstrap button doc并且有componentClass道具我无法理解。他们解释它＆＃34;您可以为此组件使用自定义元素类型＆＃34;。

这个道具的目的是什么？任何例子都将不胜感激。

Answer 1

Doc就在这里。基本上，当您创建Button组件时，默认情况下它将呈现为button html元素。如果您希望将其包装在“自定义组件”中，例如<span>，您可以使用componentClass属性来处理该问题。

示例：

  var Button = React.createClass({

    render() {
      return <h1 ref='button_node'>
      <ReactBootstrap.Button bsStyle="success">Button</ReactBootstrap.Button>
      </h1>;
    }
  });  

  var CustomButton = React.createClass({

    render() {
      return <h1 ref='button_node'>
      <ReactBootstrap.Button componentClass="span" bsStyle="danger">Custom one</ReactBootstrap.Button>
      </h1>;
    }
  });  

  ReactDOM.render(<Button/>, document.getElementById('button')); 
  ReactDOM.render(<CustomButton/>, document.getElementById('custom-button'));

在这种情况下，Button将在button中呈现为默认CustomButton元素和span。

在reactbootstrap中componentClass prop的目的是什么

1 个答案: