Question

流检查运行时类型错误吗？

让我说我有反应组件，显示用户对象的userName和Icon。用户对象是

type User: {|
    name: string,
    icon: { url: string }
  |},

没有流程我写这个。

const MyIcon = ({user}) => {
  const name = user.name || ''
  const icon = user.icon || {}
  const url = icon.url || ''

  return <Image src={url}>
}

// other component
<MyIcon user={{}}

这不会给我错误。但这不会让我失望。默认值。

但是通过流程，我可以做到这一点

type User = {|
    name: string,
    icon: { url: string }
  |}

const MyIcon = ({user}: {user: User}) => {
  return <Image src={url}>
}

// other component
<MyIcon user={{}}

它给了我很好的错误。

但我的应用是从网络获取用户数据。网络请求可以为null。或者不是null只是错误的结构化对象。像这样。

const user = await getUserFromNetwork() 
// what if user={name: { q: 1 }, icon: null}

现在我的流程代码包含运行时错误。我不得不再次写这样的代码。

type User = {|
    name: string,
    icon: { url: string }
  |}

const MyIcon = ({user}: {user: User}) => {
  const name = user.name || ''
  const icon = user.icon || {}
  const url = icon.url || ''
  return <Image src={url}>
}

// other component
const user = await getUserFromNetwork() 
// what if user={name: { q: 1 }, icon: null}
<MyIcon user={user}

因此，与非流量版本相比，它只是额外的工作，使用Flow有什么意义？

即使我使用React的defaultProps user={name: { q: 1 }, icon: null}结果也有错误。

我错过了什么吗？或者流程仅用于源代码数据检查并在网络数据上使用它是错误的？

Answer 1

Flow仅检查代码的使用是否正确（根据提供的类型）。不能确定网络数据的类型是否正确，但如果添加类型，则假定它是假的。

在您的情况下，您应该执行额外的检查，以确保它具有正确的类型。如果没有，您可以添加默认值。

如何在网络数据上使用流量？

1 个答案: