Question

我创建了一个样式化的组件，我试图触发事件处理程序，但非触发。如何处理样式化组件中的事件？这是我实现的同一功能的不同版本，但没有一个起作用。

V1

import React, { useState } from 'react'
import styled from 'styled-components'


const SomeDiv = styled.div`
                padding: 16px;
                font-family: sans-serif;
                ...
`
export default function CustomDiv(){

const Div = ({ children, onClick }) => {
        return (
            <SomeDiv onClick={onClick}>{children}</SomeDiv>
        )
    }

return(
       <Div onClick={() => console.log('hi')}><span>Hello</span></Div>
)
}

V2

import React, { useState } from 'react'
import styled from 'styled-components'


const SomeDiv = styled.div`
                padding: 16px;
                font-family: sans-serif;
                ...
`
export default function CustomDiv(){


return(
       <SomeDiv onClick={() => console.log('hi')}><span>Hello</span></SomeDiv>
)
}

Answer 1

V2对我来说很好。V1需要一些工作。这两个示例都起作用：

max.poll.interval.ms

为什么点击事件在样式化组件上不起作用？

1 个答案: