React-Spring,Hooks的用法

发表于 | 更新于: | 分类于 | 阅读次数:
字数统计: 86 | 阅读时长 ≈ 1


React-Spring，Hooks的用法

React-Hooks让组件的状态管理简洁了很多。下面是React-Spring的Hooks用法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
//Hooks.jsx
import React from 'react';
import { useSpring, animated } from 'react-spring';

const HookedComponent = () => {
    const [props] = useSpring({
        opacity: 1,
        color: 'white',
        from: { opacity: 0 },
        delay: '2000'
    })
    return <animated.div style={props}>This text Faded in Using hooks</animated.div>
}

export default HookedComponent;