React/Semantic添加对按钮的操作调用
提问于 2019-11-25 04:36:58
使用Semantic-UI / ReactJS希望在button上添加onClick函数，但是当我添加时，它也会在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>参见演示结果这里，在此页面中，使用You can pass a Button props object.来查找示例。
回答 3
Stack Overflow用户
回答已采纳
发布于 2019-11-25 04:47:51
由于在操作属性中传递一个对象来创建按钮，所以您可以简单地添加一个onClick属性
<Input
action={{
color: "teal",
labelPosition: "left",
icon: "cart",
content: "Checkout",
onClick: handleClick
}}
actionPosition="left"
placeholder="Search..."
defaultValue="52.03"
/>https://codesandbox.io/s/semantic-ui-example-gyk4m?module=%2Fexample.js
Stack Overflow用户
发布于 2019-11-25 04:48:15
您需要在操作中添加onClick属性。
action = {{
color: 'teal',
labelPosition: 'left',
icon: 'cart',
content: 'Checkout',
onClick: handleClick
}}Stack Overflow用户
发布于 2019-11-25 04:51:51
您使用的是Input和handleClick，而不是Button，您需要分别使用Input和Button，然后按以下按钮调用函数：
<Input
placeholder='Search...'
defaultValue='52.03',
/>
<Button color='teal' content='Checkout' icon='cart' labelPosition='left' onClick={this.handleClick} />页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/59032010
复制相关文章
腾讯云开发者
