javascript - TypeScript用接口如何描述数组的问题
某草草
某草草 2017-07-05 10:36:13
0
1
1003
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初学者,想问一下各位:

  1. 这种问题产生的原因是什么

  2. 类似this.state这种结构的数据应该怎么用interface描述(主要是history这个数组怎么描述)

某草草
某草草

全部回复(1)
Peter_Zhu
  1. 原因就是接口没有正确继承数组接口,导致数组的slice方法定义丢失

  2. 改成下面这样

interface History extends Array<Squares>{}
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板