如何获取自定义React/Rect Native组件的参数和类型定义

Question

我构建了一个自定义的React Native Input组件，它在聚焦时在底部显示一个深色边框，但当我使用该组件时，我没有得到VS Code Intellisense提供的道具建议。

function TextInputComponent(props) {
const [controlledValue, setControlledValue] = useState('');
const [focused, setFocused] = useState(false);
const {
placeholder,
onChangeText,
autoCapitalize,
ref,
secureTextEntry,
value,
defaultValue,
controlled,
editable,
...rest
} = props;
return (
<TextInput
ref={ref}
value={controlled ? controlledValue : value}
defaultValue={defaultValue}
secureTextEntry={secureTextEntry}
placeholder={placeholder}
placeholderTextColor={globalColors.semiGray}
autoCapitalize={autoCapitalize}
editable={editable}
mode="outlined"
onFocus={() => {
setFocused(true);
}}
onBlur={() => {
setFocused(false);
}}
style={[
styles.textInput,
focused ? {borderColor: globalColors.blue} : {},
]}
onChangeText={text => {
if (controlled) {
console.log(text.toLowerCase());
setControlledValue(text.toLowerCase());
onChangeText(text);
} else {
onChangeText(text);
}
}}
{...rest}
/>
);
}
const styles = StyleSheet.create({
textInput: {
...elementStyles.input,
},
});

有没有什么方法可以在不使用TypeScript的情况下获得道具和类型定义？

/**
* 
* @param {{header: string, subheader: string, imageAlt: string, contentList: Array, orderLink: Object, contentLink: Object}} props 
*/

我已经看到了@params的定义方式，但我只想扩展默认的TextInput定义，而不是再次为我的自定义组件编写所有类型定义。

Answer 1

检查道具类型。你可以很容易地用它进行道具检查