在 app.tsx 我得到了這樣的功能。
由于我沒有回傳任何內容，因此我將回傳值設定為 void
const addToDo = (newToDoText: string): void => {
setToDos([...todos, { id: 4, text: newToDoText, completed: false }]);
};
我將此函式傳遞給表單
<ToDoForm addToDo={addToDo} />
當我這樣寫時，ToDoForm 中出現錯誤
//Error Here
const ToDoForm = ({ addToDo : () => void}) => {
有兩個錯誤，1 在右括號} 上表示預期的運算式。
另一個在=>箭頭上，上面寫著; is expected
我究竟做錯了什么
uj5u.com熱心網友回復：
您似乎正在嘗試將屬性解構語法與物件型別注釋結合起來（但它們必須是獨占語法）。嘗試以下重構之一：
TS游樂場
// You can type the props separately like this:
type ToDoFormProps = {
addToDo: (newToDoText: string) => void;
};
// Then you can use them like this:
const ToDoForm1 = (props: ToDoFormProps) => {
props.addToDo; // (newToDoText: string) => void
};
// You can destructure the "addToDo" property like this:
const ToDoForm2 = ({ addToDo }: ToDoFormProps) => {/* ... */};
// Or you can write the props type inline:
const ToDoForm3 = (props: { addToDo: (newToDoText: string) => void }) => {
props.addToDo; // (newToDoText: string) => void
};
// Or combine the inline type and destructured property:
const ToDoForm4 = ({ addToDo }: { addToDo: (newToDoText: string) => void }) => {/* ... */};
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/468670.html
標籤：打字稿