Ref is not a prop

已于 2022-01-25 10:18:26 修改
阅读量288 收藏
点赞数
分类专栏： React前端 文章标签： react.js
于 2021-09-17 15:16:55 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wuChiSha/article/details/120349620
版权

       看其他人使用ref 是，子组件有两个参数，props和ref，照猫画虎，自己也这么写，有一天突然想到一个问题，为啥要这么麻烦，直接通过props接收不久行了，于是试了下，没反应，控制台还报错了

 百度一番，原来ref 和key一样，是React内部的保留关键字，所以不能通过props来接收

参考：

小前端读源码 - React16.7.0(一) - 知乎

https://stackoverflow.com/questions/38089895/react-ref-is-not-a-prop

懒得懒
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue和react学习笔记.rar
10-26
整理的笔记资源 含有vue和react学习笔记，和相应案例代码。 可以简单入门vue 和react~
jqgrid is not a function
AinUser的博客
11-25 3059
这个原因呢，我遇到的有两种 第一种就是函数或者参数写的有问题 第二种就是没有引入文件或者引入的文件不正确(一般为js文件) 如果是使用jqGrid插件的话，那么应该是缺少下面的文件 如果你遇到了其他的原因，请评论下方，帮助他人解惑。
Mongodb记录
qq_15138049的博客
10-10 1547
Mongodb
【Oracle】RAC11gR2 Grid启动顺序及启动故障诊断思路
orasid的博客
06-29 4897
从11gR2开始，Oracle RAC的架构有了比较大的变化，集群层面相交于之前的版本有了比较大的变动，原来的rac架构基本上属于cssd、crsd、evmd三大光秃秃的主干进程，日志数量较少，对于rac无法启动原因，采用最原始的方法逐一查看各个进程的日志也可找到无法启动的原因。然而从11gR2之后，集群层发生了比较大的变动，以下是$GRID_HOME/log/rac1/下的目录情况： [gri
DB2 Error Messages (Sorted by SQLCODE)
weixin_34341229的博客
08-02 2664
DB2 Error Messages (Sorted by SQLCODE) DB2 Error Messages (Sorted by SQLCODE) SQLCODESQLSTATEDescription 000 00000 The SQL statement finished successfully. 01xxx The SQL statemen...
React源码解毒 - 检测开发者是否错误的使用了props属性
前端高薪进击手记
11-13 1120
对props的错误使用是在开放环境下生效的，在createElement 方法相应的处理逻辑中，它先判断是否当前处于开发环境中，是则判断key或者ref是否存在，如果存在，则调用相对应的处理方法，通过为props的key或者ref属性设置getter侦听器，来实现对props中错误使用key或ref的错误提示，当你尝试通过props.key 或者props.ref 来获取相应属性的时候，就给你在控制台中报出相应组件的错误使用提示。
React 深度学习：3. ReactElement
weixin_33840661的博客
05-30 1573
ReactElement 下面导出了多个方法：createElement 用于创建并返回一个新的ReactElement 元素createFactory 用于返回固定类的createElement方法 【已废弃】cloneElement克隆一个元素isValidElement验证一个对象是否为 ReactElement 。cloneAndReplaceKey使用给定 key返回...
html 前端传入后台为object_小前端读源码 - React16.7.0(一)
weixin_35846141的博客
12-23 221
2019年，前端的情况暂时还是三足鼎立的局面，React，Vue和Angular。平常开发中我们基本上离不开框架的使用，但是大部分人也只是了解如何使用，或者深入一点的就是知道用什么框架做什么样的功能会有什么样的坑（经验所谈）。但是又有多少人愿意去认真读一读框架的源码，深入理解背后的逻辑呢？因为现在所在公司使用的是React，那么我将会一连串的写好几篇关于React的源码阅读文章，一步一步深入去了解...
【React】forwardRef 用法
qq_45677671的博客
06-25 1745
react 中 forwardRef 使用方法及案例
【React】非受控组件
richest_qi的博客
07-14 706
DOM这块是非之地，React并不想涉足其中，所以更多时候会我们会使用 受控组件。 但是，如果想蹚浑水，非 操作DOM 不可，React也提供了ref这一解决方法，即 非受控组件。 我们来感受下 React组件的控制权一点点被剥夺后 有啥不同。 React掌控全局 <select value={this.state.value}><select/>，组件状态state同步记录<select>的value值，此时<select>受控，React掌控全局。 in
global.prop
11-02
keil5配色（暗色系）
浅谈Vuejs Prop基本用法
10-19
本篇文章主要介绍了Vuejs Prop基本用法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
build.prop
12-09
Google Pixel 2 XL的build.prop，可以查看谷歌机型代码，可以供改机型用。 Pixel 2 XL代号为taimen
深入浅析Vue中的Prop
08-27
Prop的基本用法很简单，只需要在子组件的Vue实例中定义该属性并把值设为目标属性的数组即可。这篇文章主要介绍了Vue中的Prop ,需要的朋友可以参考下
ext grid 问题（一） EN
icedcoco
07-02 493
这是我在http://www.extjs.com/forum/showthread.php?t=27784上面找到的英文的grid的常见问题及解决方法 部分中文对照：http://www.iteye.com/topic/197071 FAQ: Grid (compiled questions, examples/tutorials, listeners, extensions) -...
诊断 Grid Infrastructure 启动问题 (文档 ID 1623340.1)
热门推荐
岁月有声。。。
04-29 1万+
修改时间:2014-2-17类型:BULLETIN 语言: English简体中文 한국어 文档内容 用途   适用范围   详细
React Hook
scqqq54515448的博客
11-15 461
1. 为什么使用 hook class 组件中的 this 难以理解，且 class 不能很好的压缩，并且会使热重载出现不稳定的情况。 所以 hook 就为解决这些问题而来： 避免地狱式嵌套，可读性提高。 函数式组件，比 class 更容易理解。 class 组件生命周期太多太复杂，使函数组件存在状态。 解决 HOC 和 Render Props 的缺点。 UI 和 逻辑更容易分离 2. Hook的一些API 我来介绍一下，hook的一些常用的api 2.1useState ..
this.$ref[].validate
最新发布
09-23
this.$refs[xxx].validate是Vue框架中的一个方法，用于对表单进行校验。根据提供的引用内容，如果xxx是一个变量传进来的，那么在使用this.$refs[xxx].validate的时候是不需要加的。只有当xxx是一个固定的值时，才需要使用this.$refs[xxx][0]。 正常情况下，如果报错"this.$refs[xxx].validate is not a function"，可能是因为nextTick延迟加载也无法解决该问题。此时，可以检查以下几点：首先，确保prop属性绑定在el-form-item上面，而不是里面的input或其他地方；其次，确保el-form的model属性绑定整个表单的model值，rules属性绑定整个表单的校验规则，ref属性获取表单的form组件，prop属性绑定每个表单的规则，validate方法对整个表单进行校验，valid属性判断每个必填表单项是否提交为true。最后，在执行this.$refs['dataAddForm'].validate((valid) => {})时，确保自定义验证里的每一个判断都有callback()被执行到。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值