设置 IconContext.Provider 游标值? (这与反应图标一起使用)

Setting IconContext.Provider cursor value? (This is being used with react-icons)

我知道我可以只对光标进行内联样式:在此示例中“悬停”到元素上,但是应该有一种方法可以使用 IconContex.Provider 使元素中的所有图标都包含指针光标反应图标

       return (
        <>
            <IconContext.Provider value={{
                color: "red",
                size: "1.2em",
                cursor: "pointer"
            }}>
                <StyledTask>
                    <h3 className="ms-2" >{task.text} <FaTimes onClick={() => { onDelete(task.id) }}></FaTimes></h3>

                    <p className="ms-2 mt-2">{task.day}</p>
                </StyledTask>
            </IconContext.Provider>
        </>
    )
}

只需在 style 属性 下添加 pointer,或作为 className:

.withPointer {
  cursor: 'pointer';
}

const App = () => {
  return (
    // Use style or className
    <IconContext.Provider
      value={{ color: "blue", style: { cursor: "pointer" }, className: 'withPointer' }}
    >
      <div>
        Hello <FaBeer />
      </div>
    </IconContext.Provider>
  );
};