Javascript 类型'；上不存在Typescript错误属性x；只读<；道具>&；只读<；{children？：ReactNode；}>'；

我不熟悉

Typescript

。使用Nextjs，我有一个基本的组件，我想进行类型检查，但是我得到了错误。如何对对象数组进行打字检查

ERROR in C:/Users/Matt/sites/shell/pages/index.tsx(22,4):
22:4 Property 'swc' does not exist on type 'Readonly<Props> & Readonly<{ children?: ReactNode; }>'.
    20 |        render() {
    21 |                const {
    22 |                        swc: { results }
       |                        ^
    23 |                } = this.props;

type Props = {
    results: Array<any>;
};

---

您已经在

swc

类中定义了

props

对象，无需破坏类本身

实际上，您正试图访问

swc.props.swc.results

，而您应该访问

swc.props.results

---

一般来说，这似乎是一个不正确的组件设置，我被你的

props

定义搞糊涂了，因为你似乎在传递

结果
prop，然后将
swc
传递给props，而props就是组件本身（？）

如果没有进一步的细节，我很难回答这个问题，但我想你会想做这样的事情：

import React, { Component } from 'react'
import fetch from 'isomorphic-unfetch'

type Props = {
   results: any[], // < try to be more specific than any[]
}

// React Components should per convention start with Uppercase
class Swc extends Component<Props, {}> {
  static async getInitialProps(ctx) {
     const res = await fetch("https://swapi.co/api/people/")
     const json = await res.json()
     return { json.swc.results }
  }

  render() {
     const { results } = this.props
     // React components should always return a singular tag 
     // (eg. div, React.Fragment, but not array of <Layout>
     const renderResults = results && results.map(result => (
         <Layout>
            {result}
         </Layout>
     ))

      return (
        <>
          {renderResults}
        </>
      )

  }
}

export default Swc

import React，{Component}来自“React”
从“同构取消蚀刻”导入提取
类型道具={
结果：任何[]，//<尝试比任何[]更具体
}
//React组件应按照惯例以大写字母开头
类Swc扩展组件{
静态异步getInitialProps（ctx）{
const res=等待获取（“https://swapi.co/api/people/")
const json=await res.json（）
返回{json.swc.results}
}
render（）{
const{results}=this.props
//React组件应始终返回单个标记
//（例如div，React.Fragment，但不是数组）
const renderResults=results&&results.map（结果=>(
{result}
))
返回(
{renderResults}
)
}
}
导出默认Swc
这样做了，但得到了错误类型错误：无法读取未定义的属性“map”-结果为emptyOkay我对我的回答后的编辑稍微感到困惑。当
swc
也是组件本身时，为什么你有
道具作为
结果
和
swc
。这闻起来更像是组件设置不正确对我来说，问题是如果你不提供一些预期的行为/描述，我就无法真正回答你的问题。我对typescript很陌生，在我学习的过程中-我只想得到一个基本的示例，在那里我可以检查道具类型。我想显示一个星球大战角色列表，并检查道具是否是一个对象数组这就是我想要的，但是这个.props是错误的。我已经编辑了question@Bomberprob try
const json=await res.json（）
return{json.swc.results}
inside
getInitialProps
我编辑的答案的其余部分应该可以用了
 { swc:
   { count: 87,
     next: 'https://swapi.co/api/people/?page=2',
     previous: null,
     results:
      [ [Object],
        [Object],
        [Object],
        [Object],
        [Object],
        [Object],
        [Object],
        [Object],
        [Object],
        [Object] ] },
  url:
   { query: [Getter],
     pathname: [Getter],
     asPath: [Getter],
     back: [Function: back],
     push: [Function: push],
     pushTo: [Function: pushTo],
     replace: [Function: replace],
     replaceTo: [Function: replaceTo] } }

import React, { Component } from 'react'
import fetch from 'isomorphic-unfetch'

type Props = {
   results: any[], // < try to be more specific than any[]
}

// React Components should per convention start with Uppercase
class Swc extends Component<Props, {}> {
  static async getInitialProps(ctx) {
     const res = await fetch("https://swapi.co/api/people/")
     const json = await res.json()
     return { json.swc.results }
  }

  render() {
     const { results } = this.props
     // React components should always return a singular tag 
     // (eg. div, React.Fragment, but not array of <Layout>
     const renderResults = results && results.map(result => (
         <Layout>
            {result}
         </Layout>
     ))

      return (
        <>
          {renderResults}
        </>
      )

  }
}

export default Swc