टाइपस्क्रिप्ट का उपयोग करके मेरे रिएक्ट ऐप में, मैं एक चाइल्ड ऑब्जेक्ट को पैरेंट में एक फंक्शन कॉल करने की कोशिश कर रहा हूं। मुझे टाइपिंग ठीक करने में कुछ समस्या आ रही है। यहां एक छोटा सा उदाहरण दिया गया है:

function RequestVisitAddress(onAddressSelected: (address: GoogleAddressParser) => void) {
  const [selectedAddress, setSelectedAddress] = useState<GoogleAddressParser | null>(null);

  const onSubmit = () => {
    onAddressSelected(selectedAddress as GoogleAddressParser);
  };

  return (
    <Button onClick={onSubmit} />
  );
}
function Parent() {
  const onAddressSelected = (address: GoogleAddressParser) => {
    console.log(address);
  };

  return (
    <RequestVisitAddress onAddressSelected={onAddressSelected} />
  );
}

जब RequestVisitAddress घटक में बटन क्लिक किया जाता है, तो मैं माता-पिता में ऑनएड्रेस चयनित विधि को चलाने के लिए चाहता हूं। हालांकि, मुझे मूल घटक में onAddressSelected विशेषता पर निम्न चेतावनी मिल रही है:

Type '{ onAddressSelected: (address: GoogleAddressParser) => void; }' is not assignable to type 'IntrinsicAttributes & ((address: GoogleAddressParser) => void)'.
  Property 'onAddressSelected' does not exist on type 'IntrinsicAttributes & ((address: GoogleAddressParser) => void)'.ts(2322)

यह काम करने के लिए मुझे क्या समायोजित करने की आवश्यकता है?

0
Mike Cole 2 अप्रैल 2020, 17:36

1 उत्तर

सबसे बढ़िया उत्तर

समस्या यह है कि RequestVisitAddress प्रॉप्स सही ढंग से टाइप नहीं किए गए हैं। यही वह है जिसे आप ढूंढ रहे हैं:

type Props = {
  onAddressSelected: (address: GoogleAddressParser) => void,
}

function RequestVisitAddress({onAddressSelected}: Props) {
  const [selectedAddress, setSelectedAddress] = useState<GoogleAddressParser | null>(null);

  const onSubmit = () => {
    onAddressSelected(selectedAddress as GoogleAddressParser);
  };

  return (
    <Button onClick={onSubmit} />
  );
}

आप अपने सभी प्रॉप्स को एक ऑब्जेक्ट में प्राप्त करते हैं, इसलिए आपको इसे एक्सेस करने में सक्षम होने के लिए प्रोप से onAddressSelected को नष्ट करना होगा।

1
JeromeBu 2 अप्रैल 2020, 14:55