最新react 16.13.1版本中,由于findDomNode被deprecated,导致react-transition-group的warning问题

来源:7-6 使用 React-Redux 进行应用数据的管理

慕标6429440

2020-06-07

听了老师的课,就想试着把typescript, react-hooks, react-redux来完成这项目练习下。配置正常工作,但是发现,在React.StrictMode模式下,引用react-transition-group会有warning,关于findDomNode的,说建议使用this.refs。抄了一个解决方案,但是感觉不是那么舒服,想请教老师下

 // 为了第三方包的一个解决方案
  const nodeRef = React.useRef(null);

  return (
    <HeaderWrapper data-test='Header'>
      <Logo href='/'/>
      <Nav>
        <NavItem className="left active">首页</NavItem>
        <NavItem className="left">下载App</NavItem>
        <SearchWrapper>
          <CSSTransition
            in={focused}
            timeout={20}
            classNames="slide"
            //这里使用了nodeRef就没有了warning???
            nodeRef={nodeRef}
          >
          <NavSearch 
            className={focused ? 'focused' : ''}
            onFocus={() => setOnFocus(true)}
            onBlur={() => setOnFocus(false)}
          />
          </CSSTransition>
          
          <i className={focused ? 'focused iconfont' : 'iconfont'}>&#xe682;</i>
        </SearchWrapper> 
写回答

2回答

Dell

2020-06-07

这块同学稍微等等吧,我会在今年对这块课程进行整体更新

1
2
我接受不了
老师,我使用function的方式创建组件,但是组件内的classNames 没有被加载在dom上,是因为什么呢
2020-06-11
共2条回复

静秋叶

2022-02-10

动画效果正常,我的也报

warning,真是:conding无常,大肠套小肠

下载视频          
0
0

React零基础入门到实战,完成企业级项目简书网站开发

主流新技术 React-redux,React-router4,贯穿基础语法

5275 学习 · 2496 问题

查看课程