Question

我正在尝试在页面上实现一个简单的路由器。我有一个父类控制哪个视图加载 HutDBStatsRouter 和2个子类 HutDBStats 和 HutDBPlayerView 。 HutDBStats包含一个带有TouchableOpacity的ListView，单击它时需要渲染HutDBPlayerView。我遇到了一个问题，我相信因为HutDBStats有自己的道具，但我无法弄清楚如何将它正确地传递给父类HutDBStatsRouter。

出于测试目的，我在HutDBPlayerView中设置相同的场景并让它渲染HutDBStats（它工作正常），但是当我让HutDBStats尝试渲染HutDBPlayerView时它不会工作。

代码相当大，所以我删除了任何不必要的信息。我得到的错误是无法读取未定义的'changeComponent'的属性。

非常感谢任何帮助。我很反应原生。

Answer 1

问题可能是HutDBPlayerView中缺少构造函数。

＆＃13;

class HutDBPlayerView extends Component {
    constructor(props) {
      super(props);
    }
    render() {
        return (
            <View>
                <TouchableOpacity onPress={() => this.props.changeComponent('Two') }>
                    <Text>Go back to ListView</Text>
                </TouchableOpacity>
            </View>
        );
    }
}

＆＃13;

如果您打算将其作为无状态组件，您甚至可以像这样编写代码：

＆＃13;

function HutDBPlayerView (props){
  return (
      <View>
          <TouchableOpacity onPress={() => props.changeComponent('Two') }>
              <Text>Go back to ListView</Text>
          </TouchableOpacity>
      </View>
  );
}

＆＃13;

从孩子那里获得父母道具

1 个答案: