react生命周期钩子中获取不到元素

最新推荐文章于 2023-06-28 17:25:59 发布
最新推荐文章于 2023-06-28 17:25:59 发布
阅读量325 收藏
点赞数
分类专栏： 笔记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45901735/article/details/107075892
版权

在全局变量改变后，我在shoul……这个生命周期钩子中，判断store仓库中的一个值，通过这个全局变量，判断是否使用中英文，然而有一部分能更新，一部分不更新，有些元素是获取不到的，于是在compentdidupdate结果得到了，所以把获取不到的元素，放在这个生命周期钩子中去判断!之后问题也就解决了!

The little baby
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
06 生命周期如何理解 React 组件生命周期？慕课专栏1
08-03
这些方法称为生命周期钩子，它们为开发者提供了在特定阶段介入组件行为的机会。面试官在考察求职者对React组件生命周期的理解时，并不只是期望听到简单列举出各个生命周期方法，而是希望听到对这些方法背后逻辑和...
react入门学习文档
最新发布
08-29
生命周期是 React 组件的生命周期钩子函数，包括 Mounting、Updating、Unmounting 等阶段。了解生命周期有助于我们更好地理解和使用 React。 组件事件 组件事件是 React 组件的交互方式。我们可以使用 React 事件...
在react组件中获取DOM元素的三种方式
qq_53436617的博客
06-28 2141
2, 在构造器中创建ref全局变量, 在标签中ref属性动态绑定这个全局变量, 通过全局变量的current字段调用。1, 在父组件中用ref获取子组件对象, 必须保证子组件是类组件, 函数式组件获取结果是undefined。1, 给标签设置ref属性, 通过this.refs调用 (老版本语法,将要废除)2, 父组件使用ref获取子组件对象后, 可以对子组件状态数据和函数执行调用和修改。3, 在标签ref属性绑定函数, 在函数中定义全局变量赋值, 通过全局变量调用。4, 使用hook语法查找DOM。
初识react（3）——react点击事件如何获取当前dom元素
小R.的博客
03-31 3299
  前不久做react项目时遇到了一个问题：设置一个点击事件后，无法获取当前dom元素。   比如我想在点击下图中的“关闭”图标后，将这部分内容隐藏。   我刚开始是按照之前jQuery的写法去写的，代码如下： closeInfo=()=>{ $(this).parent().hide(); };   然而却没有达到我想要的效果，$(this)并没有获取到当前dom元素。   后...
react使用ref获取DOM报Function components cannot be given refs.
qq_46433453的博客
11-03 984
解决useRef 获取函数式组件的警告
react 使用 useEffect 及踩坑
量子前端的博客
02-03 3712
useEffect 介绍 useEffect时reactHook中最重要，最常用的hook之一。 useEffect相当于react中的什么生命周期呢？ 这个问题在react官网中有过介绍，在使用的过程中，容易被忽略，在面试的时候却经常被问及，（面试造航母，上班拧螺丝？），开个玩笑这个问题并不难回答，下面是react官方的原话： 如果你熟悉 React class 的生命周期函数，你可以把 useEffect Hook 看做 componentDidMount，componentDidUpdate 和 co
React组件生命周期详解
12-03
React组件提供了生命周期的钩子函数去响应组件不同时刻的状态，组件的生命周期如下： 实例化 存在期 销毁期 实例化 首次调用组件时，有以下方法会被调用（注意顺序，从上到下先后执行）： getDefaultProps ...
详解React中setState回调函数
08-27
3. setState管理大量组件状态也许会导致不必要的生命周期函数钩子调用。 最后，需要注意的是，setState回调函数的作用相当于`componentDidUpdate`生命周期函数，都是在组件的状态更新后执行的。因此，在使用...
React 组件转 Vue 组件的命令写法
08-27
3. **生命周期**：尽管React和Vue的生命周期钩子名称不同，但两者都有类似的阶段，如挂载、更新和卸载。 4. **事件处理**：React将事件处理函数绑定到组件实例方法上，而Vue则将它们放在`methods`对象下，使结构更为...
react获取原生html元素,怎么获取react的dom
weixin_36293915的博客
06-03 1330
怎么获取react的domReact提供的获取DOM元素的方法有两种，一是react-dom中的findDOMNode()，二是refs。1、findDOMNodefindDOMNode通常用于React组件的引用，其语法如下：import ReactDOM from 'react-dom';ReactDOM.findDOMNode(ReactComponent);当组件被渲染到DOM中后，fin...
React开发 获取不到当前触发事件的元素
weixin_33852020的博客
06-01 699
应用场景：一组列表，需获取当前触发 onClick 事件元素上的 data-key ； 就一个事件冒泡导致的问题；初步没解决方案是给 li 下的所有子元素都加上 data-key显然这是很很很笨的方法，仅为当时测试用。 实在不行，其他地方也要解决这个问题就停下脚步 得深挖下，事件捕捉/冒泡的过程（有空补全） 既然是子元素冒泡上来了，就得...
在react中获取dom元素
weixin_45052838的博客
09-22 1万+
1、ref获取dom元素 <div ref={el => this.nodeEle = el}> ====> this.nodeEle即为获取到的元素 2、根据id获取dom元素 document.getElementById(“idName”) 3、通过类名获取dom元素 document.getElementsByClassName(“className”) 获取到的是一个数组集 4、根据标签名获取dom元素 document.getElementsByTagName(‘标
React获取DOM方法
liangzelei的博客
08-31 3万+
以下提供三种方法： import React, { Component } from 'react'; import ReactDOM from 'react-dom'; class Index extends Component { onClick(event){ console.log(event.target.value); // 第一种方式 var subm
在React中获取真实DOM节点的几种方法
JohnZhongJob的博客
12-16 9863
    在使用React编写代码时，难免会遇到需要获取到真实DOM节点的时候，那么在React中我们怎么去获取呢？以下总结了几种方法： 1. 通过在标签中添加ref属性（react官方已弃用） class Index extends Component {   onClick(event){       const inputDom = this.refs.submit; con...
React数据获取为什么一定要在componentDidMount里面调用？
mym940725的博客
12-12 1万+
转载自：https://segmentfault.com/q/1010000008133309/a-1020000008135702 这与React组件的生命周期有关，组件挂载时有关的生命周期有以下几个: constructor() componentWillMount() render() componentDidMount() 上面这些方法的调用是有次序
react的生命周期函数（超详细）
热门推荐
尘生杜若
03-05 6万+
话不多说，直接进入正题！ 先来了解一下react的生命周期函数有哪些： 组件将要挂载时触发的函数：componentWillMount 组件挂载完成时触发的函数：componentDidMount 是否要更新数据时触发的函数：shouldComponentUpdate 将要更新数据时触发的函数：componentWillUpdate 数据更新完成时触发的函数：componentDidUpdate...
React 获取真实的DOM节点
chenzhen200638的专栏
02-19 7838
获取真实的DOM节点 组件并不是真实的 DOM 节点，而是存在于内存之中的一种数据结构，叫做虚拟 DOM （virtual DOM）。只有当它插入文档以后，才会变成真实的 DOM 。 有时需要从组件获取真实 DOM 的节点，这时就要用到 ref 属性。 var MyComponent = React.createClass({ handleClick: function() {
react 生命周期执行
07-29
需要注意的是，React 16.3版本之后，一些生命周期方法已被标记为过时或不推荐使用，如componentWillMount、componentWillReceiveProps、componentWillUpdate等。推荐使用新的生命周期方法和React钩子函数来替代。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值