react-hooks
我是一个粉刷匠呀
这个作者很懒,什么都没留下…
展开
-
使用react-pdf-js插件实现pdf在线预览(兼容性良好)
1.下载包yarn add react-pdf-js2.使用import PDF from 'react-pdf-js';const [page, setPage] = useState(1); //pdf当前页数const [pageTotal, setPageTotal] = useState(0); //pdf总页数const onDocumentComplete = (pages) => { setPage(1); setPageTotal(pages);原创 2021-09-01 19:28:52 · 4033 阅读 · 3 评论 -
移动端react-hooks+TS上拉距离顶部一定距离时 改变页面样式
const stickyRef = useRef() //创建一个ref<div ref={stickyRef}></div> //关联refconst [sticky, setSticky] = useState(true); //判断是否固定 通过sticky更换样式const onScroll = () => { const top = stickyRef.current!.getBoundingClientRect() //获取元素距离顶原创 2021-08-27 15:38:08 · 537 阅读 · 0 评论 -
React-Hooks的useReducer()钩子
基本使用const [state, dispatch] = useReducer(reducer, initialState)// useReducer接受reducer函数和状态的初始值作为参数,返回一个数组,数组第一个元素是状态的当前值,数组的第二个元素是发送action的dispatch函数举例:const [state, dispatch] = useReducer(reducer, {value : 0})<button onClick={()=> dispatch({t原创 2021-06-25 10:19:23 · 113 阅读 · 0 评论 -
React-Hooks的useContext()共享状态钩子使用与实现
例:需要在ComponentOne和ComponentTwo中共享父组件的状态// 两个子组件共享父组件状态<div> <ComponentOne/> <ComponentTwo/></div>// 使用 React Context API,在组件外部建立一个 Contextconst AppContext = React.createContext()// 使用AppContext.Provider提供的Context对象,这原创 2021-06-25 09:41:27 · 887 阅读 · 0 评论