这个语法在React Native和TypeScript中是什么意思?

Question

var = ({ data }: { data: interfaceModel }) => (
// data is used here
)

这个语法是什么意思?我知道第二个data的界面是interfaceModel。但是为什么出现了两次data呢?

Answer 1

这意味着它是一个函数，它的参数必须是一个应该包含键data的对象，数据应该包含在interfaceModal中定义的键，{data}这是参数，{data: interfaceModel}这是类型

例子

interface interfaceModel {
name:string
age:number
}
interface DataModel {
data: interfaceModel
}
const myFunc = ({ data }: { data: interfaceModel }) => (
// data is used here
)
let myData:DataModel = {data:{name:'Your name', age:32}}
myFunc(myData);

myFunc也可以定义为

const myFunc = (myData:dataModel) => (
// myData.data is used here
) 

Answer 2

var = ({ data }: { data: interfaceModel }) => (
// data is used here
)

首先{ data }是一个解构属性。您可以这样编写相同的函数:

var = (props: { data: interfaceModel }) => (
props.data // valid
)

第二个{data: interfaceModel}只是类型的文字表示。

你可以这样重写:

interface Data {
data: interfaceModel
}
var = (props: Data) => (
props.data // valid
)