我正在用 Expo 構建 Raect Native，試圖制作自定義下拉選單，我發現并寫了一篇很棒的文章，如何在這里做到這一點
使用 typeScript 語法撰寫的代碼，但我的專案使用 javaScript 語法所以
- 如何更改代碼語法以在我的專案上作業？
- 可以在一個專案上同時使用 Typescript 和 javascript（因此使用 Typescript 構建可重用組件）？
interface Props { label: string; } const Dropdown: FC<Props> = ({ label }) => { const [visible, setVisible] = useState(false); const toggleDropdown = () => { setVisible(!visible); }; const renderDropdown = () => { if (visible) { return ( <Text style={styles.dropdown}> This is where the dropdown will be rendered. </Text> ); } }; return ( <TouchableOpacity style={styles.button} onPress={toggleDropdown} > {renderDropdown()} <Text style={styles.buttonText}>{label}</Text> <Icon type='font-awesome' name='chevron-down'/> </TouchableOpacity> ); }
uj5u.com熱心網友回復：
js 腳本是有效的 ts 腳本，因此您可以“同時使用兩者”。
（實際上每件事都是打字稿（有時沒有型別））
要制作完整的 javascript，您必須抑制型別和介面，如下所示：
// interface Props {
// label: string;
// }
// const Dropdown: FC<Props> = ({ label }) => {
const Dropdown = ({ label }) => {
const [visible, setVisible] = useState(false);
const toggleDropdown = () => {
setVisible(!visible);
};
const renderDropdown = () => {
if (visible) {
return (
<Text style={styles.dropdown}>
This is where the dropdown will be rendered.
</Text>
);
}
};
return (
<TouchableOpacity
style={styles.button}
onPress={toggleDropdown}
>
{renderDropdown()}
<Text style={styles.buttonText}>{label}</Text>
<Icon type='font-awesome' name='chevron-down'/>
</TouchableOpacity>
);
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/494245.html
標籤：javascript 打字稿 反应式