React Native导航组件路由问题

2024-03-05

新的反应本机用户在这里。我遇到了问题,不知道如何继续。我能够正确运行反应导航,然后开始收到错误:“路由组件必须是 React 组件”,但除非我遗漏了某些内容,否则我相信我引用的组件is一个反应组件。请参阅下面的 index.android.js 和下面的 Home.js:

//index.android.js
import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View
} from 'react-native';
import {
  TabNavigator,
  StackNavigator
} from 'react-navigation';

import Home from './app/components/Home/Home';
import Search from './app/components/Search/Search';

export default class demoApp extends Component {
  render() {
    return (
      <SimpleNavigation/>
    );
  }
}

export const SimpleNavigation = StackNavigator({
  Home: { 
    screen: Home,
    header: { visible: false },
    navigationOptions: {
      title: 'Home',
      header: null
    },
  },
  Search: { 
    screen: Search,
    navigationOptions: {
      title: 'test'
    },
  },
},{});


//Home.js
import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  Image,
  TextInput,
  Button,
  TouchableHighlight
} from 'react-native';

class Home extends Component {
    constructor(props){
        super(props);
        this.state = {zipCode: ''}
    }
    navigate = (zipCode) => {
        this.props.navigation.navigate('Search', zipCode);
    }
    render() {
        return (
            <View style={styles.container}>
                <View style={[styles.boxContainer, styles.boxOne]}>
                    <Image style={styles.logo} source {require('../../images/Logo.png')} />
                    <Text style={styles.title}>An application to do things</Text>
                    <TextInput 
                        style={styles.textInput} 
                        placeholder='Enter a Zip Code' 
                        onChangeText={(zipCode) => this.setState({zipCode})}
                        >
                    </TextInput>
                </View>
                <View style={[styles.boxContainer, styles.boxTwo]}>
                    <TouchableHighlight onPress={() => this.navigate(this.state.zipCode)}>
                        <Text style={styles.searchBox}>
                            Search
                        </Text>
                    </TouchableHighlight>
                </View>
            </View>
        );
    }
}

非常感谢任何帮助/反应指针。谢谢你!


我认为问题在于home.js因为你没有导出它。尝试这个 :

export default class Home extends Component { ... } 
^^^^^^^^^^^^^^

添加这些或仅添加

 export default Home; 

在结束时home.js file

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

React Native导航组件路由问题 的相关文章

  • 如何在进入新活动之前终止线程和处理程序

    大家好 在我尝试清理处理程序时 这段代码可能有点混乱 因为我一直在尝试追踪崩溃发生的位置 我有一个对话框活动 显示密码输入 进度条由线程和处理程序动画显示 似乎当我试图查看进度条是否完成并尝试终止线程时 当我尝试进入新活动时 我这样做的方式
  • Javascript - 将值从下拉框传递到 Google Maps API

    我正在使用 Google 地图 API 为一家出租车公司创建报价表 目前 用户在 2 个文本框中输入出发点和接载点 API 会计算两点之间的距离以及行程费用 我正在尝试添加两个具有设定位置的下拉框 以便用户可以选择这些位置之一或使用文本框输
  • Google Chrome 106 可拖动导致元素消失

    使用拖放元素时 绝对定位元素中包含的大多数其他元素都会从屏幕上消失 如果我调整窗口大小 这些元素会出现 但在开始拖动时会再次消失 我在最新版本的 Google Chrome 106 和 Beta 版本 107 0 5304 18 以及现在的
  • 为什么Android应用程序在发布到市场后尺寸会增加?

    我最近在 Android 市场上发布了我的应用程序 显示应用程序大小为 5 4MB 而实际 apk 大小为 2 8MB 为什么显示多出2MB 我应该如何限制我的应用程序大小 请帮我 您的应用程序大小会增加 因为您使用了复制保护选项ON在发布
  • 未捕获的错误:找不到模块“jquery”

    我在用Electron https github com atom electron制作桌面应用程序 在我的应用程序中 我正在加载一个外部站点 Atom 应用程序之外 可以说http mydummysite index html http
  • onClick 未在带有子项的 LinearLayout 上触发

    我有一个自定义的 LinearLayout 和一个较小的 TextView 子级 我希望能够单击 TextView 未覆盖的区域 因此我将 clickable true 和 onclicklistener 设置为 LinearLayout
  • Typeahead.js substringMatcher 函数说明

    我只是在做一些研究Typeahead js这是一个非常酷的图书馆 感谢文档 我已经成功地获得了一个基本的示例 该文档也非常好 但是我试图弄清楚以下代码块实际上在做什么 var substringMatcher function strs r
  • 在Android Studio中更改项目主题?

    我使用浅色主题创建了一些项目 现在我想将其更改为深色 但我不知道该怎么做 顺便说一句 我不是问如何在代码中做到这一点 只是问如何更改项目的默认主题 在 AndroidManifest xml 的 application 标签下 您可以设置您
  • 淡出和循环一组 div 的最佳方式

    假设我有以下 div div class a You are funny div div class b You are smart div div class c You are cool div 最好的展示方式是什么div a持续 5
  • Twitter 嵌入时间轴小部件

    我继续下载http platform twitter com widgets js http platform twitter com widgets js And the http platform twitter com embed t
  • Chartjs刻度标签位置

    尝试让 Y 轴刻度标签看起来像image https i stack imgur com XgoxX png 位于秤顶部且不旋转 缩放选项当前如下所示 scales yAxes id temp scaleLabel display true
  • 为什么“tbody”不设置表格的背景颜色?

    我在用 tbody 作为 CSS 选择器来设置background color在一个表中 我这样做是因为我有多个 tbody 表内的部分 它们具有不同的背景颜色 我的问题是 当使用border radius在细胞上 细胞不尊重backgro
  • 如果数字小于 10,则显示前导零 [重复]

    这个问题在这里已经有答案了 可能的重复 JavaScript 相当于 printf string format https stackoverflow com questions 610406 javascript equivalent t
  • 无法在前端使用 JavaScript Fetch API 将文件上传到 FastAPI 后端

    我正在尝试弄清楚如何将图像发送到我的 API 并验证生成的token那是在header的请求 到目前为止 这就是我所处的位置 app post endreProfilbilde async def endreProfilbilde requ
  • Redux-saga 从操作中获取数据返回patternOrChannel 未定义

    我需要将动态数据从屏幕发送到操作 减速器 并使用该数据从 API 获取数据 但是当我在我的rootSaga我会收到这样的错误 在检查 take patternOrChannel 时未捕获 patternOrChannel 未定义未捕获在 r
  • 需要有关 React Js 的帮助

    我是 React Js 新手 我的代码无法正常工作 请看下面 这是我的脚本文件Main jsx 该文件由 React 编译 输出放置在 dist 文件夹下的 main js 文件中 var react require react react
  • 在没有 Wifi 的情况下获取 Android 设备的 MAC 地址

    如何获取没有 Wifi 接口的 Android 设备 例如 Android 模拟器 的网络接口的 MAC 地址 通过WifiManager返回获取的WifiInfonull EDIT 更清楚地说 我必须与本地网络上的现有网络协议 不是我设计
  • 在 Javascript 中减少/分组数组

    基于this https stackoverflow com a 40774906 3254598例如 我想以稍微不同的方式按对象进行分组 结果应该如下 key audi items make audi model r8 year 2012
  • 在 React Native 中将 Props 传递到屏幕

    我已经开始学习 React Native 并且一如既往地从创建可重用组件开始 我了解了如何在创建自定义组件时传递和访问 props 我想在 React Native 中创建一个基本屏幕 它具有通用属性 并且我的应用程序中的所有屏幕都可以设置
  • 单击列表时使用 bootstrap Dropdown 防止下拉菜单消失

    我正在使用使用引导下拉菜单 http twitter github com bootstrap javascript html dropdowns生成下拉菜单 我想防止点击菜单时菜单消失 我已经实现了以下代码 但它不起作用 知道如何修复它吗

随机推荐

  • 反距离加权插值

    我想计算一个重量作为距离的倒数 例如反距离加权插值 http en wikipedia org wiki Inverse distance weighting double wgt 0 wgt tmp result 0 for int i
  • 单一职责原则在 OOP 中有效吗?

    我正在努力理解如何将单一职责原则与 OOP 结合使用 如果我们要完全遵循这一原则 那么我们是否会留下许多类 其中许多类可能每个都只有一个方法 如果我们不严格遵循这个原则 那么这个原则还有什么意义呢 我喜欢这样陈述单一职责原则 你编写的每件事
  • x86 虚拟化如何工作

    任何人都可以推荐有关虚拟化的好读物吗 我建议英特尔软件开发人员手册 http www intel com products processor manuals 具体来说卷3B http www intel com Assets PDF ma
  • 没有名为“delta.tables”的模块

    我收到以下代码的错误 请帮忙 from delta tables import ModuleNotFoundError No module named delta tables INFO SparkContext Invoking stop
  • 启动 RPC 服务器时出现“端点重复”

    我的程序使用 Microsoft RPC 进行进程间通信 为了准备接收 RPC 调用 程序运行以下序列 RpcServerUseProtseqEp 然后 RpcServerRegisterIf 则 RpcServerListen 该程序按照
  • 如何理解这段由数字组成的 JavaScript 代码

    这是 JavaScript 代码 我认为它是十六进制形式并尝试对其进行解码 但仍然找不到该代码的含义 我在我的博客模板中使用此代码 我想了解这段javascript代码的真正含义
  • 再次:UnicodeEncodeError:ascii 编解码器无法编码

    我有一个我想要解析的 XML 文件的文件夹 我需要从这些文件的元素中获取文本 它们将被收集并打印到 CSV 文件中 其中的元素按列列出 I can实际上现在就这样做some我的文件 也就是说 对于我的许多 XML 文件 该过程进展顺利 并且
  • Page_ClientValidate 未定义 (ASP.NET MVC)

    我有一个 ASP NET MVC 表单 布局如下 using Html BeginForm null null FormMethod Post new id ccform Html ValidationSummary true Please
  • 从 bash 捕获 telnet 超时

    参考这个问题 使用 bash 脚本自动化 telnet 会话 https stackoverflow com questions 7013137 automating telnet session using bash scripts 我正
  • Terraform 无效的“each”属性

    我有一个 tfvars json 文件 我想用它来传递我的服务器配置 test test machines master01 node type master image ubuntu 20 04 server type cx21 loca
  • 验证 ECPoint 在给定 x y 坐标和曲线名称的 EllipticCurve 对象上是否有效

    给定公钥的 x 和 y 坐标以及曲线名称 我需要确定这些坐标是否代表曲线上的有效点 如果是 则测试通过 如果不是 则测试失败 到目前为止我的代码是 String curve String testGroupHeaders get curve
  • 快速从子控制器调用parentController方法

    我正在做一个简单的customtableview项目 我有viewController swift和customcell swift文件 我在viewcontroller文件中有一个方法 我如何从customcell文件调用该方法 任何帮助
  • Android:暂停录音并恢复

    我使用以下代码作为基础来创建记录器 我可以开始和停止录音 并且它会正确保存在该位置 但现在我有一个要求暂停录音机 如何暂停录音机 并恢复录音 我在我的三星 Galaxy Ace 中看到了一个录音应用程序 它有一个暂停按钮 有人可以启发我吗
  • 使用按位运算符计算两个数字的和

    我粘贴代码以使用按位运算符查找两个数字的总和 请建议是否可以优化 谢谢 public static int getSum int p int q int carry 0 result 0 for int i 0 i lt 32 i int
  • JSP+Tomcat:单点登录

    如何使用 Tomcat 服务器为许多 JSP 应用程序创建单点登录的最佳方式 一种可能性是使用 Tomcats 构建 SSO 机制 http tomcat apache org tomcat 5 5 doc config host html
  • C++ 11 标准是否保证 std::atomic<> 实现为无锁操作?

    我正处于一个十字路口 我试图在基于互斥锁的数据结构和无锁 可能还有无等待 数据结构之间选择一个 在深入挖掘时 我没有发现有关 C 11 标准是否支持原子类型的无锁操作的任何消息 甚至对于基于宽度的积分 例如atomic uint32 t 换
  • 半透明 JFrame 边框

    我想让 JFrame 边框透明 所以我尝试使用我自己的 Border 类来做到这一点 private class ShadowBorder extends AbstractBorder private static final int RA
  • Java 中字符串(非结构化数据)的 K 最近邻实现

    我正在寻找 Java 中针对非结构化数据的 K 最近邻算法的实现 我发现了许多数字数据的实现 但是我如何实现它并计算文本 字符串 的欧几里得距离 以下是 double 的一个示例 public static double Euclidean
  • Python:如何使用 OpenCV 从网络摄像头捕获图像

    我想使用 OpenCV 从网络摄像头捕获并保存大量图像 这是我目前的代码 import cv2 camera cv2 VideoCapture 0 for i in range 10 return value image camera re
  • React Native导航组件路由问题

    新的反应本机用户在这里 我遇到了问题 不知道如何继续 我能够正确运行反应导航 然后开始收到错误 路由组件必须是 React 组件 但除非我遗漏了某些内容 否则我相信我引用的组件is一个反应组件 请参阅下面的 index android js