Question

我是React Native和ES6的新手，但对JS有一点了解，我很难找到以下代码的含义。我知道它做了什么，我可以识别它的一部分，但不是一切。

  static navigationOptions = ({ navigation }) => {
    if (navigation.state.params == undefined )
    {
      return {
        headerTitle: <Text></Text>,
        headerLeft: null
      }
    }
    else
    {
      return {
        headerTitle: navigation.state.params.toolbarComponent,
        headerLeft: null
      };
    }
  };

现在我知道箭头功能，这很好，但我真的很困惑导航变量的来源。如果我删除大括号，那么第一行看起来像这样：

static navigationOptions = ({ navigation }) => {

然后代码抱怨道具不存在，所以我假设这在导航上使用了绑定。

所以我能解决的问题是导航的来源，即在其他地方的其他例子中，我如何知道调用变量名称的内容。如果你可以确认变量导航周围的大括号，那么我会很感激。我怀疑这确实是一个ES6问题。

Answer 1

static navigationOptions = ({ navigation }) => {

^这是解构分配。因此，例如，您使用对象参数调用navigationOptions函数，如

navigationOptions({navigation:navigation, somethingElse: somethingElse})

然后它将从传递的对象中选择导航。

在此处阅读有关解构的更多信息https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

这是关于此http://wesbos.com/destructuring-objects/

的另一篇好文章

同时检查Destructuring objects as function parameters in ES6

理解（{var}）符号和箭头函数React Native

1 个答案: