मैं इस गाइड से अनुवाद कर रहा हूं। यहां वह कोड है जिसका मैंने अब तक अनुवाद किया है (Todo.tsx के अंदर):

import * as React from 'react'
import * as PropTypes from 'react';

interface ITodo
{
  onClick : ()=>void,
  completed : boolean,
  text : string
}
​
const Todo = ({ onClick, completed, text } : ITodo) => (
  <li
    onClick={onClick}
    style={ {
      textDecoration: completed ? 'line-through' : 'none'
    }}
  >
    {text}
  </li>
)

हालांकि मैं दूसरे भाग के साथ संघर्ष कर रहा हूँ (जे एस में :)

Todo.propTypes = {
  onClick: PropTypes.func.isRequired,
  completed: PropTypes.bool.isRequired,
  text: PropTypes.string.isRequired
}

चूंकि PropTypes में कोई भी bool या func या string सदस्य शामिल नहीं हैं।

2
AnArrayOfFunctions 10 अक्टूबर 2018, 18:47

3 जवाब

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

सबसे पहले, टाइपस्क्रिप्ट के साथ PropTypes का उपयोग करने का वस्तुतः कोई कारण नहीं है।

दूसरे, आप allowSyntheticDefaultImports या अधिक हाल के जोड़ को सक्षम करने पर विचार कर सकते हैं जिसका नाम मुझे आपके tsconfig.json से हटा देता है ताकि आप import * as होने से बच सकें।

तीसरा, आपको तर्क में अपेक्षित प्रॉप्स पर जोर देने के बजाय अपने SFC को React.SFC के रूप में परिभाषित करना चाहिए। निम्नलिखित नुसार:

const Todo: React.SFC<ITodo> = (props) => ();

आप निश्चित रूप से जेएसएक्स को नष्ट कर सकते हैं और उपयोग कर सकते हैं जैसा आप कर रहे थे।

1
Sam A. Horvath-Hunt 10 अक्टूबर 2018, 16:32

import * as PropTypes from 'react'; को import * as PropTypes from 'prop-types'; से बदलें

1
Matt McCutchen 10 अक्टूबर 2018, 15:50
import * as React from 'react'
import * as PropTypes from 'react';

ये दो पंक्तियाँ अजीब हैं और मुझे यकीन नहीं है कि वे काम कर रही हैं। React और PropTypes अपने स्वयं के पैकेज का डिफ़ॉल्ट निर्यात हैं। इसलिए यदि आप रिएक्ट v15.5 और इसके बाद के संस्करण का उपयोग कर रहे हैं तो यह होना चाहिए:

import React from 'react';
import PropTypes from 'prop-types';

यदि आप रिएक्ट के निचले संस्करण का उपयोग कर रहे हैं तो यह भी कर सकता है:

import React, { PropTypes } from 'react';

आपके TypeScript प्रश्न पर:

आप propTypes घोषणा को हटा सकते हैं, क्योंकि आप पहले से ही अपने द्वारा घोषित interface का उपयोग करके TypeScript के साथ अपना घटक टाइप कर रहे हैं। इसलिए propTypes बेकार हो जाते हैं।

यदि आपका कोई सहारा वैकल्पिक है तब भी आप defaultProps का उपयोग कर सकते हैं

0
Kevin Amiranoff 10 अक्टूबर 2018, 16:10