首页 > 解决方案 > 必须使用解构道具分配问题

问题描述

我在 react-native 中制作了一个应用程序,当我尝试将 props 的值之一放在文本上时,我收到如下错误消息:Must use destructuring props assignment

代码是这样的:

<Text style={styles.SubTextButton}>
      {props.date1} - {props.date2}
</Text>

道具看起来像这样:

(props: {
  text: string
  date1: string
  date2: string
})

问题是,这实际上不会破坏我的应用程序并且一切正常。但是我想知道这是否可能是代码编写中的格式问题,甚至是ESlinter的错误。

标签: node.jsreactjstypescriptreact-nativereact-native-android

解决方案


您收到此警告是因为在您的 Eslint 中设置了规则:"react/destructuring-assignment": [<enabled>, 'always']

Eslint 希望您使用解构赋值以这种方式编写:

const MyComponent = ({ date1, date2 }) => {
  return (
    <Text>
      {date1} - {date2}
    </Text>
  )
}

推荐阅读