问题描述
我想获取其他组件值。
但我没有找到灵魂并尝试发布 {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>
)