React / Semantic UI在按钮上添加号召性用语

Question

使用Semantic-UI / ReactJS想要在onClick上添加button函数，但是当我添加时，它也点击input上的函数，但是我只想在button上添加]

handleClick= (e) => this.setState({ click: true});
...
  <Input
    action={{
      color: 'teal',
      labelPosition: 'left',
      icon: 'cart',
      content: 'Checkout',
    }}
    actionPosition='left'
    placeholder='Search...'
    defaultValue='52.03',
    onClick={this.handleClick}
      />
结果：

<div class="ui left action input">
  <button class="ui teal icon left labeled button">
    <i aria-hidden="true" class="cart icon"></i>
    Checkout
  </button>
  <input type="text" placeholder="Search..." value="52.03" />
</div>
请参见演示结果here，在此页面中，搜索You can pass a Button props object.以查找示例。

使用Semantic-UI / ReactJS希望在按钮上添加onClick函数，但是当我添加时，它也会在输入单击时调用函数，但是我只想在按钮上添加handleClick =（e）=> this.setState（{ ：...

Answer 1

由于您在action属性中传递了一个对象来创建按钮，因此您只需添加onClick属性

Answer 2

您需要在内部添加onClick属性。

Answer 3

您同时使用了Input和handleClick，而不是Button，需要分别使用Input和Button，然后像这样调用按钮上的功能：