类型错误：类型上不存在属性

Question

我正在为 React 项目使用类型脚本。 我已经定义了所有值的类型，但是prop.option？我无法获取名称的值。 请告诉我答案。

type PropTypes = {
  option?: OptionType[]
}

type OptionType = {
  id?: number
  name?: string
  price: number
  quantity: number
}

function OrderItemPCForm(props: PropTypes) {

  console.log('===>', props.option?.name)
return(<div>...</div>)}

Property 'name' does not exist on type 'OptionType[]'.

Answer 1

您的问题是您将option定义为数组（不是对象）

option?: OptionType[]

这样当您尝试访问值时

console.log('===>', props.option?.name)

它会抛出错误，因为您尝试从未定义的option object 中获取name

它有两种修复方法

第一个是您应该删除option上的数组定义

type PropTypes = {
  option?: OptionType //removed `[]`
}

第二个修复可以是

console.log('===>', props.option[index].name) //index can be populated from a loop

但这也取决于您想要实现哪种类型的意图（一个数组或一个 object option ）