hook中使用ref使用

最新推荐文章于 2024-07-05 14:08:52 发布

zuo_zuo_blog

最新推荐文章于 2024-07-05 14:08:52 发布

阅读量1.6k

点赞数

分类专栏： React 文章标签： react.js

本文链接：https://blog.csdn.net/zuo_zuo_blog/article/details/120272415

版权

React 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

对于antd的fom表单
hook使用ref
在这里插入图片描述

import React, { useState, useEffect, useRef } from ‘react’; const
dateRef = useRef();
dateRef.current.setFieldsValue({
targetCompletionDate: moment(recordTime)
});

父组件：

         引入                  useRef

           声明ref的名字     const dateRef = useRef()（不同于creatRef）

           复值给组件         ref={dateRef}

           使用                  dateRef.current.funName下面的方法

子组件：

         引入                    useImperativeHandle,forwardRef

         例如在子组件DateRange中使用

                                        function DateRange(props, ref) {

                                                      useImperativeHandle(ref, () => ({

                                                               funName:()=>{}

                                                       })

                                         }
                               DateRange = forwardRef(DateRange)//进行一层包装在导出

                               export default DateRange