使用 React 导航传递的参数中的奇怪行为

Question

这是屏幕：

import React from 'react';
import { View, StyleSheet, Image, TouchableOpacity, Text } from 'react-native';
import { NavigationActions } from 'react-navigation'
export default class ContentScreen extends React.Component {    
  render() {
    const { state } = this.props.navigation;
    const { code } = state.params.code
    return(
      <Text>CONTENT GOES HERE: {JSON.stringify(state)} / '{code}'</Text>
    )
  }
}

和导航调用：

<TouchableOpacity key={k} onPress={() => {navigate("Content", {code: k})}} style={styles.listing}>

以下是

显示的内容：

CONTENT GOES HERE: {"params":{"code":"222"},"key":"id-151010...","routeName":"Content"} / ''

这真的很@（#$奇怪。该值显然存在于 state.params.code 中，从 JSON 字符串可以看出，但在访问时，它不存在。 Object.values(state.params)和Object.keys(state.params)给出预期的结果（["code"]和["222"]）。

那么，比如，关于发生了什么的任何想法？或者关于如何进一步调查的想法？

Answer 1

看起来你解构的层次太深了。

const { code } = state.params.code;

这基本上是在寻找这个.props.state.params.code.code

尝试：

Const { code } = state.params;

或：

const { navigation: { state: { params: { code } } } } = this.props;