标签: react-native-router-flux

我的代码是:

...
<Router>
 <Scene key="com1" component={Com1} initial/>
<Scene key="com2" component={Com2}/>
</Router>
...
com1.js
...
onPress={Actions.com2}

我换com1了com2.

但我需要传递值的输入框Com1来Com2.

我怎样才能做到这一点？

我redux在react-native使用react-native-router-flux和中有以下配置redux-persist.我想在刷新时检索最后一个当前路由,但是路由堆栈在重新加载时被覆盖.

这是reducers/index.js文件

import { combineReducers, createStore, applyMiddleware, compose } from 'redux'
import { persistStore, autoRehydrate } from 'redux-persist'
import { AsyncStorage } from 'react-native'
import logger from 'redux-logger'

import { startServices } from '../services'
import navigation from './navigation'
import devices from './devices'
import rooms from './rooms'


import { ActionConst } from 'react-native-router-flux'

function routes (state = {scene: {}}, action = {}) {
  switch (action.type) {
    // focus action is dispatched …

有没有办法如何使用React Native Router Flux综合定义场景堆栈(历史)？假设我有一个应用程序,用户可以自然地从中导航A –> B –> C.我想在场景C上启动应用程序,它具有与自然行为(A -> B -> C)相同的历史记录,因此用户可以B从最初打开的场景导航回来C.

编辑:我想它应该可以通过使用Redux Persist以某种方式实现,但我发现了这个相关的问题.

我刚刚开始围绕React Native,并使用Redux来管理我的UI组件state的NativeBase库和react-native-router-flux正在处理视图之间的导航.

目前我正在构建一个从一组guest对象创建的基本列表.该列表存储在Redux存储中,我可以访问它并相应地显示.列表中的每个项目都与数组guest内的项目相关联guests.我想使列表中的每个项目都可触摸,然后将相关guest对象作为属性传递给下一个视图以显示详细信息.

为此,我使用的onPress函数是与ListItem组件关联的标准函数(请参阅此处的 NativeBase文档).我还遵循了文档,react-native-router-flux并在组件本身之外定义了导航操作,以便ListItem在按下时调用它,而不是每次渲染时调用.

我的问题是,我发现onPress={goToView2(guest)}每次ListItem渲染时都会调用函数,而不是在ListItem按下时调用函数.

我确信它一定是简单的,我省略了.有什么建议？

View1.js - 显示以下初始列表的视图guests:

import React, { Component } from 'react';
import { Container, Header, Title, Content, Footer, FooterTab, Button, Icon,
  Text, List, ListItem } from 'native-base';
import { connect } from 'react-redux';
import { Actions as NavigationActions } from 'react-native-router-flux'; …

版

• react-native-router-flux v3.35.0
• 本机反应v0.31

我的场景很少.其中一个场景的子场景很少.如何从一个主场景导航到其中一个子场景？

示例:

<Router createReducer={reducerCreate} getSceneStyle={getSceneStyle}>
        <Scene key="root">
          <Scene key="login" direction="vertical" component={Login} title="Login" hideTabBar hideNavBar />
          <Scene key="tabbar" initial={show}>
            <Scene key="main" tabs tabBarStyle={styles.tabBarStyle} tabBarSelectedItemStyle={styles.tabBarSelectedItemStyle} tabBarIconContainerStyle={styles.tabBarIconContainerStyle} >
              <Scene key="courses" component={Courses} title="Courses" icon={IconCourses} navigationBarStyle={styles.navigationBarStyle} titleStyle={styles.titleStyle} initial />
              <Scene key="register"  component={Register} title="Register" icon={IconRegister} navigationBarStyle={styles.navigationBarStyle} titleStyle={styles.titleStyle} />
              <Scene key="schedule" component={Schedule} title="Schedule" icon={IconSchedule} navigationBarStyle={styles.navigationBarStyle} titleStyle={styles.titleStyle} />
              <Scene key="evaluation" component={Schedule} title="Evaluation" icon={IconEvaluation} navigationBarStyle={styles.navigationBarStyle} titleStyle={styles.titleStyle} />
              <Scene key="profile"
              component={Profile}
              title="Profile"
              icon={IconProfile}
              navigationBarStyle={styles.navigationBarStyle}
              titleStyle={styles.titleStyle}
              onLeft={() => { Actions.login(); }}
              leftTitle="Add Account"
              onRight={() => { Actions.login({type: …

以下是React Native应用程序启动一段时间后的Android日志输出,然后通过终止Meteor服务器将其与Meteor(DDP)服务器断开连接.

使用console.log("<App /> render")指示时render的功能App组件被称为,似乎只要render函数被再次调用后createContainer传递给它一些新props的Key is already defined触发错误.

导致此错误/警告的原因是什么？我们如何解决？该应用仍然运行良好,但这里肯定是错的.

12-23 02:27:01.875 31197 19338 I ReactNativeJS: Running application "RNapp" with appParams: {"initialProps":{},"rootTag"
:1}. __DEV__ === true, development-level warning are ON, performance optimizations are OFF
12-23 02:27:01.891 31197 19338 I ReactNativeJS: render
12-23 02:27:01.995 31197 19338 I ReactNativeJS: Connected to DDP server.
12-23 02:27:01.999 31197 19338 I ReactNativeJS: Connected to DDP server.
12-23 02:27:02.012 31197 19338 I ReactNativeJS: …

我们正在构建一个RN应用程序(RN0.37),我们遇到了一个问题,当应用程序运行时,我们得到一个" TypeError: JSON.stringify cannot serialize cyclic structures".

API响应中没有任何相关性发生变化,最近问题消失了,但是在擦除/重建时(由不相关的问题触发)重新出现.

我怀疑是使用了几个包:" react-native-router-flux"和" react-native-permissions",但我无法在应用程序中找到任何相关内容.

目前我对"react-native-router-flux"的怀疑主要基于这篇文章:https://github.com/aksonov/react-native-router-flux/issues/363

我对"反应本机权限"的怀疑主要是基于这样一个事实,即在这个项目中包含这个包的时机是可疑的,并且似乎与这个错误的表现相吻合 - 尽管我无法证明绝对肯定.

我唯一的另一个线索是,JSON.stringify错误似乎总是在一个警告列表之前.他们都读到"这个合成事件是出于性能原因重复使用的.如果你看到这个,你就是在一个已发布/无效的合成事件上访问该属性.这被设置为null.如果你必须保留原始合成事件,使用event.persist()见https://facebook.github.io/react/docs/events.html#event-pooling以获取更多信息." 列表如下(始终按相同顺序):nativeEvent,type,target,currentTarget,eventPhase,bubbles,cancelable,timeStamp,defaultPrevented,isTrusted和touchHistory.

以下是我的package.json:

"dependencies": {
  "blueimp-md5": "2.5.0",
  "moment": "2.16.0",
  "phone-formatter": "0.0.2",
  "react": "15.3.2",
  "react-native": "0.37.0",
  "react-native-asset-library-to-base64": "1.0.1",
  "react-native-aws3": "0.0.3",
  "react-native-button": "1.7.1",
  "react-native-cached-image": "1.2.2",
  "react-native-camera-kit": "4.0.1",
  "react-native-camera-roll-picker": "1.1.9",
  "react-native-contacts": "0.5.2",
  "react-native-fbsdk": "0.4.0",
  "react-native-fetch-blob": "0.10.0",
  "react-native-fs": "2.0.1-rc.2",
  "react-native-geocoder": "0.4.5",
  "react-native-image-crop-picker": "0.10.5",
  "react-native-image-resizer": "0.0.12",
  "react-native-nav": "1.1.4",
  "react-native-permissions": "0.2.5",
  "react-native-photo-view": "1.2.0",
  "react-native-router-flux": "3.37.0",
  "react-native-stripe": "1.2.1",
  "react-native-swipe-list-view": "0.3.1",
  "react-redux": "4.4.6", …

我正在使用react-native-router-flux 4.0.0-beta.17作为我的学习项目.我需要自定义标题.例如背景颜色,标题对齐等.我找不到关于它的好文档.其中一个有类似的东西

 <Router sceneStyle={{backgroundColor: '#81b71a'}}>
     <Scene key="root">
        <Scene key='login' component={LoginForm} title='Please Login :)' />
     </Scene>
 </Router>

但它没有做任何事情.

请给我一些关于好文档的参考,如果可能的话,请给我一些关于如何设置路由器样式的信息.我在哪里可以找到一份全面的文件？

我正在创建一个内部布局。我是从另一个场景来到这个场景的。所以在开始时呈现另一个布局。在我进入第二个场景（带有 TextInput 标签）后，我收到如下警告：

componentWillMount 已弃用，将在下一个主要版本中删除。请改用 componentDidMount。作为临时解决方法，您可以重命名为 UNSAFE_componentWillMount。请更新以下组件：App、Container、Image、Text< TouchableOpacity、Transitioner、View。

这很奇怪，因为我没有使用 componentWillMount 方法，所以我猜它是隐式调用的。

这是组件的代码

 class MainTopBarAfterSearch extends Component {
constructor() {
    super();
    this.state = { text: " " };
}

render() {
    const { topBarContainer, imageStyle, textInputStyle } = styles;
    return (
        <View style={topBarContainer}>
            <TouchableOpacity onPress={() => Actions.menu()}>
                <Image
                    source={require("../../../resources/menuWhite.png")}
                />
            </TouchableOpacity>
            <TextInput
                style={textInputStyle}
                placeholder="Begin to search"
                value={this.state.text}
                onChangeText={text => this.setState({ text })}
            />
            <Image source={require("../../../resources/filter.png")} />
        </View>
    );
}
}

我使用 react native 和 react-native-router-flux 进行导航

当我想移动屏幕时，出现错误“currentlyFocusedField 已弃用，将在未来版本中删除。使用 currentFocusedInput”

但屏幕仍然因错误而移动

我如何解决它

这是我的路由器

    import 'react-native-gesture-handler';

import React, { Component } from 'react';
import {
    Router,
    Scene,
    Stack,
} from 'react-native-router-flux';

import Loading from '../screens/Loading';
import Welcome from '../screens/Welcome';
import Register from '../screens/Auth/Register';

export default class RouterLinked extends Component {
    render() {
        return (
            <Router>
                <Stack key="root" type="replace">
                    <Scene key="Welcome" component={Welcome} initial={true} hideNavBar={true}/>
                    <Scene key="Register" component={Register} title="Register" />
                    <Scene key="Loading" component={Loading} />
                </Stack>
            </Router>
        );
    }
}

这是我的主页

import React, { Component …