我如何在反应中获得其他组件值?

问题描述

我想获取其他组件值。

但我没有找到灵魂并尝试发布 {register} 但它不起作用...

我尝试过useRef(),但是因为我在写react-form-hook包,所以很难应用。 react-form-hook 页面上有关于 useRef() 的描述,但是对我没有帮助。

请帮帮我!

[父组件]

import React from "react";
import { useForm } from "react-hook-form";
import PostcodeDaum from "../../component/Forms/DaumApi/PostcodeDaum"

const RegisterCenter = ({address}) => {
    const { register,handleSubmit } = useForm();

//

    return (
        <form className="singup-form" onSubmit={handleSubmit(onSubmit)}>
            <div>
                <label>Center Address</label>     
                <PostcodeDaum ref={register}/>
            </div>
        </form>
    )
}

[子组件]


import React,{ useState } from "react";
import DaumPostcode from "react-daum-postcode";

const PostcodeDaum = ({register}) => {
    const [isAddress,setIsAddress] = useState('');
    const [isPostOpen,setIsPostOpen] = useState(false);

    const postCodeStyle = {
//
      };

    const handleComplete = (data) => {
        let fullAddress = data.address;
        //
        setIsAddress(fullAddress);
    };

    return (
        <div>
            <input type='text' name='address' ref={register}  readOnly = {true} defaultValue={isAddress} />
            <button type="button" onClick={()=> setIsPostOpen(true)}>검색</button>
            {isPostOpen? <DaumPostcode style={postCodeStyle} onComplete={handleComplete}/> : null}
        </div>
    )
}

export default PostcodeDaum;

谢谢!

解决方法

像这样修改父组件:

return (
        <form className="singup-form" onSubmit={handleSubmit(onSubmit)}>
            <div>
                <label>Center Address</label>     
                <PostcodeDaum register={register}/>
            </div>
        </form>
    )