首页 > 解决方案 > React Native 0.61 中引入的快速刷新不起作用

问题描述

(也发布在https://github.com/facebook/react-native/issues/27583

更新:一天过去了,我再次启动了我的应用程序。自发布问题以来没有改变任何东西。现在它工作正常。不知道发生了什么......从两个人将此问题标记为有用的事实,我知道我不是唯一一个遇到这个问题的人......

我正在使用 React native 0.61 运行一个非常基本的“应用程序”(单个文件,单个组件),其代码附在下面。

为 android 开发,在带有 genymotion 的 windows 10 上。

快速刷新已打开,但它似乎不起作用,例如,当:

  1. 我正在将“帖子”字符串更改为“新帖子”
  2. 当我删除帖子按钮时

只有调试菜单的“重新加载”会刷新应用程序并呈现更改。知道为什么吗?

这是代码:

import React, { useState } from 'react';
import { View, TouchableOpacity, Text, StyleSheet } from 'react-native';

export const App = () => {

  const [resource, setResource] = useState('todos');

  return (
    <View style={{ flex: 1, alignItems: 'center', marginTop: 30 }}>
      <View style={{ flexDirection: 'row', marginTop: 0,
        alignItems: 'center', justifyContent: 'center' }}>
        <TouchableOpacity onPress={() => (setResource('posts'))}>
          <View style={styles.button}>
            <Text style={styles.buttonText}>
              Posts
            </Text>
          </View>
        </TouchableOpacity>
        <View style={{ width: 20 }} />
        <TouchableOpacity onPress={() => setResource('todos')}>
          <View style={styles.button}>
            <Text style={styles.buttonText}>
              Todos
            </Text>
          </View>
        </TouchableOpacity>
      </View>
    </View>
  );
}

const styles = StyleSheet.create({
  buttonText: {
    color: 'black',
    fontSize: 20
  },
  button: {
    backgroundColor: '#a8a',
    justifyContent: 'center',
    alignItems: 'center',
    paddingVertical: 5,
    paddingHorizontal: 10,
    borderRadius: 2
  }
});

标签: react-native

解决方案


我发现有时 Metro Bundler 会“卡住”。这可以解释为什么当你第二天运行它时,它运行良好。

当事情因为(似乎)没有明显原因而变得奇怪时,我会:

yarn start --reset-cache


推荐阅读