更新
我通過從以下位置更改我的 useState 宣告來實作此目的:
const [ data, setData ] = useState([]);
到
const [ data, setData ] = useState<any>([]); //{type: read/write/notify/error, bin: 8 int binary, ascii: ASCII Value}
但是,我意識到這違背了使用 Typescript 的目的。所以,我基于@tomleb3 答案的下一步是為data這樣的介面創建一個介面:
const [ data, setData ] = useState<DataType>([]); //{type: read/write/notify/error, bin: 8 int binary, ascii: ASCII Value}
interface DataType{
chx: any,
bin: string,
type: string,
ascii: string
}
但這給出了一個錯誤:
“never[]”型別的引數不能分配給“DataType |”型別的引數 (() => 資料型別)'。型別 'never[]' 不能分配給型別 '() => DataType'。型別 'never[]' 不提供與簽名 '(): DataType' 的匹配項。
我不知道如何從這里開始,因為洗掉[]useState 宣告然后將錯誤推送到我使用setData()帶有以下錯誤的呼叫的任何地方:
“any[]”型別的引數不可分配給“SetStateAction<DataType |”型別的引數 未定義>'。型別 'any[]' 不能分配給型別 '(prevState: DataType | undefined) => DataType | 不明確的'。
原帖
我已經使用 react/typescript 作業了幾天,并通過做一個小專案來自學。作為其中的一部分,我目前正在將一些基于類的代碼轉換為鉤子。
我有以下基于(js)類的代碼,我不知道如何轉換為在帶有打字稿的鉤子中使用:
this.setState({
data: [
...this.state.data,
{
chx: chx,
type: type,
bin: bin,
ascii: ascii,
},
],
});
在基于鉤子的等效項中,我知道我將setData();用于簡單狀態。但是,如何轉換上面的示例?我的嘗試(如下)顯然是錯誤的,因為我收到了錯誤:Type '{ chx: unknown; type: string; bin: string; ascii: string; }' is not assignable to type 'never'.但是我堅持下一步應該做的事情來嘗試解決這個問題:
setData([
...data,
{
chx: chx,
type: type,
bin: bin,
ascii: ascii,
}
])
任何指標/解決方案將不勝感激。
謝謝。
uj5u.com熱心網友回復:
您收到的錯誤是 Typescript 錯誤,而不是 React 錯誤。
您的代碼非常好,但是在使用 Typescript 時,我們需要像輸入其他所有內容一樣輸入我們的狀態。
例如,它看起來像這樣:
interface State {
key1: string,
key2: number,
key3: boolean,
}
function myComponent() {
const [state, setState] = useState<State>({
key1: 'test',
key2: 42,
key3: false,
})
}
這允許 Typescript 知道您的狀態的結構,從而使其能夠應用相關的型別保護和限制。
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/372386.html
