React
分享各种react常见功能,疑难杂症
Cassy_Wu
把每天生活都过的像IDE里面的代码一样跳跃闪亮。我, 是菜鸟,有颗想当大神的心。
展开
-
(针对多个react版本)获取组件的dom元素/值
工作中不免遇到各种react版本,获取dom元素/值是常见需求。所以今天针对目前的几个版本点提供不同的解决方案。欢迎留言讨论补充。感谢 ^ _ ^针对多个react版本 - 父组件获取子组件的dom元素/值 React 16.3版本以上第一、子组件非公用组件,使用createRef实现第一、子组件公用组件,使用forwardRef实现React 16.3版本以下第一、子组件非公用组件,使用createRef实现第一、子组件公用组件,使用forwardRef实现React 16.3版本以上分两种情况:原创 2020-12-12 21:20:11 · 1149 阅读 · 0 评论 -
React Hook - 对比Class组件理解学习
Hooks 出了好些时间,之前看过官方文档。用的不多忘了些。趁着复习的时间,写篇博客整理一下自己的理解。如果能够启发些同行新手那就功德无量了。废话不多说,我按照官方已出的API,...原创 2020-02-14 17:32:39 · 2000 阅读 · 0 评论 -
React通过原生鼠标事件实现拖拽(drag and drop)列表重排序
虽然现在html5已经有支持拖拽的事件,但是支持还不那么全面。所以目前大部分的拖拽还是通过原生的鼠标事件来实现列表重新排序。话不多说。一步步开始做吧盆友们可以通过下面链接查看所有代码和效果。https://codesandbox.io/s/drap-and-drop-to-reorder-list-iqwqjStep1.准备一个模拟数据let list = [];for(let i = 0; i< 10; i++){ list.push(`item ${i}`);}Step2原创 2020-06-25 12:36:04 · 3082 阅读 · 3 评论 -
React公用scrollToTop(返回顶部)组件
现在web页面要兼容各种设备,部分页面的内容长度在手机端就显得过于冗长。除了给客户提供一个按钮,一键返回顶部。更好的客户体验就是当客户做某种操作的时候,就自动滚动到顶端。这样就能顺畅的进行接下来的操作了。目前我所接触到需要自动返回顶部的需求分为两种当客户切换页面时当客户当前页面进行某些操作或者顶端显示错误信息总共两个步骤1.创建一个单独的组件import { Component } from 'react';import { withRouter } from 'react-router-原创 2020-06-20 10:37:00 · 2443 阅读 · 0 评论