react-genie

‍♂️ React-genie

‍♂️ 由 @thekitze 制作

其他项目:

• Sizzy - 一个面向设计师和开发者的浏览器,专注于响应式设计
• React 学院 - 互动的 React 和 GraphQL 研讨会
• Glink - 变更日志、路线图、用户请求
• Benji - 终极健康和生产力平台
• JSUI - 一个强大的 UI 工具包,用于管理 JavaScript 应用程序
• YouTube 博客 - 关注我的旅程

使用于 sizzy.co

CodeSandbox

https://codesandbox.io/s/react-genie-example-8xfsc

演示

https://8xfsc.csb.app/

依赖项

• styled-components
• layout-styled-components
• React-动画
• React-intersection-observer

使用方法

yarn add React-genie

只需在任何位置渲染 RevealGlobalStyles 组件，它将添加动画的类名：

import {RevealGlobalStyles} from 'react-genie'

const App = () => {
  return (
    

    
  );
};

为了使 clone 正常工作,您的元素需要接受 className,style 和 ref 作为属性。因此,如果您尝试克隆自定义组件,请确保这些属性都可用。