javascript - TypeScript用接口如何描述數組的問題
問題描述
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開發,上面的代碼在vscode中提示錯誤:Property ’slice’ does not exist on type ’History’.。
slice是數組方法,如果換成類似let a: string[] = [’Hello’]這種方式則slice方法可以正常使用不會報錯。
題主目前是還是TypeScript初學者,想問一下各位:
這種問題產生的原因是什么
類似this.state這種結構的數據應該怎么用interface描述(主要是history這個數組怎么描述)
問題解答
回答1:原因就是接口沒有正確繼承數組接口,導致數組的slice方法定義丟失
改成下面這樣
interface History extends Array<Squares>{}
相關文章:
1. javascript - Vue.js的ElementUI庫中,如何主動觸發checkbox組件的change事件?2. javascript - webpack 打包 reactjs項目 css 分離3. javascript - 關于js高級程序中的問題4. javascript - 關于微信掃一掃的技術問題5. javascript - 如何清除向可編輯的(contenteditable)元素里粘貼的文本的標簽和樣式?6. javascript - 請教移動端從詳情頁返回到列表頁原來位置的問題?7. javascript - vuex中子組件無法調用公共狀態8. javascript - (_a = [""], _a.raw = [""],....); js一個小括號的是什么意思?9. javascript - js正則替換日期格式問題10. javascript - ios上fixed定位問題,定位在底部的按鈕不顯示了,但是又可以點擊到,換了一個類名就可以顯示了,但是設置的字體大小卻失效了
