javascript - TypeScript用接口如何描述數(shù)組的問題
問題描述
interface Squares { squares: (null | string)[]}interface History { [index: number]: Squares}interface State { history: History stepNumber: number xIsNext: Boolean}class Game extends React.Component { state: State constructor() { super() this.state = { history: [{squares: Array(9).fill(null) }], stepNumber: 0, xIsNext: true } } handleClick(i: number) { const history = this.state.history.slice(0, this.state.stepNumber + 1) }
以上代碼為項目代碼的一部分,項目使用React+TypeScript開發(fā),上面的代碼在vscode中提示錯誤:Property ’slice’ does not exist on type ’History’.。
slice是數(shù)組方法,如果換成類似let a: string[] = [’Hello’]這種方式則slice方法可以正常使用不會報錯。
題主目前是還是TypeScript初學(xué)者,想問一下各位:
這種問題產(chǎn)生的原因是什么
類似this.state這種結(jié)構(gòu)的數(shù)據(jù)應(yīng)該怎么用interface描述(主要是history這個數(shù)組怎么描述)
問題解答
回答1:原因就是接口沒有正確繼承數(shù)組接口,導(dǎo)致數(shù)組的slice方法定義丟失
改成下面這樣
interface History extends Array<Squares>{}
相關(guān)文章:
1. css - C#與java開發(fā)Windows程序哪個好?2. mysql無法添加外鍵3. css - 定位為absolute的父元素中的子元素 如何設(shè)置在父元素的下面?4. java - Mybatis查詢數(shù)據(jù)庫時出現(xiàn)查詢getInt()的錯誤5. JavaScript事件6. javascript - 原生canvas中如何獲取到觸摸事件的canvas內(nèi)坐標(biāo)?7. javascript - es6將類數(shù)組轉(zhuǎn)化成數(shù)組的問題8. 在mac下出現(xiàn)了兩個docker環(huán)境9. css3 - flex 父標(biāo)簽設(shè)置align-item:center,子元素flex:1,不起作用10. java - 是否類 類型指針、引用作為形參 ,函數(shù)結(jié)束不會自動析構(gòu)類?
