将道具传递到React.js中的另一个组件

时间:2019-12-03 15:30:21

标签: reactjs react-props

我的组件如下所示

import React, { Component } from 'react';

class InputText extends Component  {
  render = () => {    
    return (
      <div>
        {this.props.label}
        <input type="text" name={this.props.name} id={this.props.id} class={this.props.class} required={this.props.extraValue}/>
      </div>
    )
  }
}

export default InputText

我正在使用上述类似的组件

<InputText name="paper" class="pen" id="mouse" extraValue="required"/>

我得到如下输出

<input type="text" name="paper" id="mouse" class="pen" required="">

为什么extraValue值不起作用?

1 个答案:

答案 0 :(得分:4)

required is a Boolean。您应该像这样通过它

<InputText name="paper" class="pen" id="mouse" extraValue={true} />

<InputText name="paper" class="pen" id="mouse" extraValue />