javascript - react 图标点击事件

标签 javascript reactjs inheritance icons

我在一些按钮上使用 npm react-icons。

不幸的是,该图标使 onClick 属性无法工作。如果单击图标外面 Angular 落里的按钮,效果很好。

我想知道是否有一个简单的解决方案,不涉及将 onClick 函数作为 Prop 传递并进入react-icons 代码并向其中添加 onClick。

模块中的代码是

    import React from 'react'
    import Icon from 'react-icon-base'

    const FaArrowUp = props => (
        <Icon viewBox="0 0 40 40" {...props}>
            <g><path d="m37.5 21.7q0 1.1-0.9 2l-1.6 1.7q-0.9 0.8-2.1 0.8-1.2 0-2-0.8l-6.5-6.6v15.7q0 1.2-0.9 1.9t-2 0.7h-2.9q-1.1 0-2-0.7t-0.8-1.9v-15.7l-6.6 6.6q-0.8 0.8-2 0.8t-2-0.8l-1.7-1.7q-0.8-0.9-0.8-2 0-1.2 0.8-2.1l14.6-14.5q0.7-0.8 2-0.8 1.2 0 2 0.8l14.5 14.5q0.9 0.9 0.9 2.1z"/></g>
        </Icon>
    )

    export default FaArrowUp

我导入图标的渲染方法有

 <button name='up' onClick={this.move}> <FaArrowUp /> </button>

最佳答案

在 github 上检查包后,我想你应该尝试这个:

 <button name='up' onClick={this.move}> <FaArrowUp onClick={() => this.move}> /> </button>

关于javascript - react 图标点击事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46589094/

相关文章:

javascript - 方法调用对象内部的方法

javascript - 通过使用 react-select 映射对象数组来生成选项

javascript - 使用鼠标滚轮时导致 IE 严重滞后的窗口滚动事件

javascript - 如何让 ServiceWorker 在缓存重置/Shift+F5 后存活下来?

css - Material-UI如何根据select组件的宽度设置MenuItem(popover)的minWidth和maxWidth

reactjs - React + Typescript : copying props of a custom component - React. PropsWithoutRef 对我不起作用

javascript - 为什么javascript在实例之间共享属性

css - 从 css 中现有的两个类创建第三个类

c++ - 如何优先使用虚方法覆盖和继承

javascript - 如何通过单击按钮添加行