小编Val*_*Val的帖子

这是我的抽屉导航:

const DashboardStack = StackNavigator({
        Dashboard: {
            screen: Dashboard
        },
    }, {
        headerMode: 'screen',
    });

const DetailsformStack = StackNavigator({
    Detailsform: {
        screen: Detailsform
    },
}, {
    headerMode: 'none'
});

const OtpStack = StackNavigator({
    Otp: {
        screen: Otp,
        drawer: {
            lockMode: 'locked-closed'
        }
    },
    }, {
        headerMode: 'none'
});

const MobilenumberStack = StackNavigator({
    Mobilenumber: {
        screen: Mobilenumber
    },
}, {
    headerMode: 'none'
});

const DrawerviewStack = StackNavigator({
    Drawerview: {
        screen: Drawerview
    },
}, {
    headerMode: 'none'
});

const ExamsheetStack = StackNavigator({ …

如果不使用Redux,如何使用react导航选项卡导航器检测选项卡更改？

我知道我需要以某种方式使用onNavigationStateChange但我无法弄清楚如何更新当前视图.

export default () => <MyTabNav
    ref={(ref) => { this.nav = ref; }}
    onNavigationStateChange={(prevState, currentState) => {
        //call function on current view
    }}
/>;

我们以下列方式使用react-native NetInfo.

export default class NetworkStatus extends React.PureComponent {
 constructor(props){
  super(props);

   NetInfo.addEventListener(
     'change',
     this.onConnectivityChange
  ); 
 }

 onConnectivityChange = (status) => {
   NetInfo.isConnected.fetch().then(isConnected => {
     console.log('*********Network status ' + (isConnected ? 'online' : 
    'offline'));
 });
}

在离线模式下启动应用程序.我们得到了以下控制台.

*********网络状态离线.

然后我们打开wifi并连接.但我们两次离线控制台.

*********网络状态离线.

*********网络状态离线.

这是NetInfo Library中的错误吗？有没有办法解决它.

使用的版本:

"反应":"16.0.0-alpha.6"

"本土反应":"0.44.0",

嗨,我希望animated.view像圆圈一样移动.我用窦思考这个但是它不起作用.有人知道怎么做吗？我不想旋转视图.它应该在圆圈中移动.我是新来的本地人.如果有人可以帮助我会很好.

//import liraries
import React, { Component } from 'react';
import { View, Text, StyleSheet, Animated, Button, TouchableOpacity } from 'react-native';

// create a component
class MyClass extends Component {
  constructor() {
    super()
    this.animated = new Animated.Value(0);
  }

  animate() {    
    this.animated.setValue(0)
    Animated.timing(this.animated, {
      toValue: Math.PI *2,
      duration: 1000,
    }).start();
  }


  render() {
    const translateY = this.animated.interpolate({
      inputRange: [0, Math.PI *2],
      outputRange: [0, 200]
    });
    const translateX = translateY
    const transform = [{ translateY }, {translateX}];
    return (
      <View style={styles.container}>
        <Animated.View …

我完全承认我现在对Reactive Native很新,所以我预计这是一个简单的答案和一个潜在的愚蠢问题:)事实上,这可能不是RN问题本身,我将在下面解释.

我所拥有的是以下代码:

class MyScreen extends React.Component {

  constructor(inProps) {
    super(inProps);
    this.state = { listData : [ ] };
  }

  render() { return (
    <View>
      <FlatList data={ this.state.listData }
        renderItem={ ({item}) =>
          <Text>{item.firstName} {item.lastName}</Text>
        }
      />
    </View>
  );  }

  async componentDidMount() {
    const data = [ ];
    let keys = await AsyncStorage.getAllKeys();
    keys.forEach(async function(inKey) {
      let obj = await AsyncStorage.getItem(inKey);
      obj = JSON.parse(obj);
      data.push(obj);
    });
    this.setState({ listData : data });
  };

}

目标只是从AsyncStorage加载数据并将其转储到列表中.看起来相当基本,对吧？不幸的是,我无法让它工作:列表是空的.

现在,为了掩盖愚蠢的事情:是的,确实存储了数据,是的,它是正确的形式(我知道这是因为如果我只是抓住一个SPECIFIC项目并将其推送到数据中,那么它会按预期显示在列表中).

实际上,我知道问题是什么:它是在keys.forEach()调用完成之前执行的setState()调用.我知道这个,因为如果我用这个替换setState()调用:

setTimeout(function() {
  this.setState({ listData : …

这个表达式对于javascript/react非常简单,用函数绑定this范围.

this.toggle = this.toggle.bind(this);

但是当引入flowtype时,会导致错误:

我该怎么做才能通过流量测试？

切换可以是任何功能,甚至是空的.

toggle() {
    /// do nothing
}

假设我有两个屏幕:

• 屏幕A.
• 屏幕B.

我最初登陆了Screen A.当我点击一个Button导航到Screen B.当我按下时Back Button,我再次导航到Screen A.

当我导航到Screen A上面的场景中时,我想调用一个动作创建者.

我只是想知道每次呈现屏幕时都会调用哪个生命周期事件.

是不是有一些事件componentWillAppear()？

注:我使用react-native与react-navigation用于导航.

我需要一些帮助来实现搜索和滚动以命中本机反应。进行了大量搜索并最终陷入了死胡同（找到了一些refs我无法开始工作的示例）。

尝试构建此代码段作为开始：

https://snack.expo.io/@norfeldt/searching-and-scroll-to

import React, { Component } from 'react';
import { Text, View, ScrollView, TextInput, StyleSheet } from 'react-native';

export default class App extends Component {

  state = {
    text: '41'
  }

  render() {
    return (
      <View style={styles.container}>

      <TextInput
        style={{height: 60, borderColor: 'gray', borderWidth: 1, borderRadius: 10, margin: 5, padding:30, color: 'black', }}
        onChangeText={(text) => this.setState({text})}
        value={this.state.text}
      />

      <ScrollView >

          {[...Array(100)].map((_, i) => {return <Text style={styles.paragraph} key={i}>{i}</Text>})}

      </ScrollView>

      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: …

我正在使用react-native-fs,出于某种原因,每当我使用exists()方法时,它总是返回为TRUE.我的代码示例如下所示:

let path_name = RNFS.DocumentDirectoryPath + "/userdata/settings.json";

if (RNFS.exists(path_name)){
    console.log("FILE EXISTS")
    file = await RNFS.readFile(path_name)
    console.log(file)
    console.log("DONE")
}
else {
    console.log("FILE DOES NOT EXIST")
}

控制台的输出是"FILE EXISTS",然后抛出一个错误,说:

错误:ENOENT:没有这样的文件或目录,打开/data/data/com.test7/files/userdata/settings.json'

如何使用该exists方法存在,而不是readFile方法？

在进一步检查时,无论文件名是什么,RNFS.exists()似乎总是返回true.为什么它总是回归真实？

path_name的显示说/data/data/com.test7/files/userdata/settings.json.

即使我将代码更改为无意义的代码,如下面的代码:

if (RNFS.exists("blah")){
    console.log("BLAH EXISTS");
} else {
    console.log("BLAH DOES NOT EXIST");
}

它仍然评估为true并显示消息:

BLAH EXISTS

我已经显示了目录的内容并验证了这些文件不存在.

我是 React-Native 开发的新手。我正在使用' react-navigation '中的TabNavigator作为React-Native中的标签栏，除了标签栏activeBackgroundColor和inactiveBackgroundColor在android中没有改变外，一切正常。它只显示蓝色，如下图所示。

import React, { Component } from 'react';
import { TabNavigator } from 'react-navigation';
import { PixelRatio } from 'react-native';

import { ColorScheme } from '../Resources/ColorScheme';
import {Fonts} from '../Resources/Fonts';

import TAB1 from '../Screens/TAB1'
import TAB2 from '../Screens/TAB2'
 /** */
 var FONT_SIZE = 8;
 if (PixelRatio.get() === 2) {
  FONT_SIZE=10
 }else if (PixelRatio.get() === 3) {
    FONT_SIZE=12
  }

export default FavoritesScreenTabNavigator=TabNavigator({
    TAB1:{screen:TAB1},
    TAB2:{screen:TAB2}
  },{
      tabBarPosition:'top',
      swipeEnabled:true,
      animationEnabled:true,
      tabBarOptions:{
          activeTintColor:ColorScheme.tabBarSelectedTintColor,
          inactiveTintColor:ColorScheme.tabBarUnSelectedTintColor,
          activeBackgroundColor:'white', …