记录下一些问题 如果有更好的解决办法 欢迎评论

1.Flastlist组件 renderItem内不能使用useState

const RenderItem = ({ item }) => {
    const [count, setCount] = useState(0);

    return (
      <View>
        <Text>{item.title}</Text>
        <Text>Count: {count}</Text>
        <Button title="Increment" onPress={() => setCount(count + 1)} />
      </View>
    );
  };
  
<FlatList data={listData} renderItem={RenderItem} />

如上使用会报错，解决办法：嵌套一层

const RenderItem = ({ item }) => {
    const [count, setCount] = useState(0);

    return (
      <View>
        <Text>{item.title}</Text>
        <Text>Count: {count}</Text>
        <Button title="Increment" onPress={() => setCount(count + 1)} />
      </View>
    );
  };
  
const renderItem = ({item}) => {
    return <RenderItem item={item} />
}
<FlatList data={listData} renderItem={renderItem} />

2.React Navigator在Flastlist item的传递

使用react-navigation做路由组件，如果需要将navigation传递到Flastlist的子组件中，需要把navigation加到渲染数组中

//DATA是渲染数组
  DATA.map(i => {
    i.navigation = navigation;
  });
  
  
<FlatList data={DATA} renderItem={renderItem} />

3.Metro服务器无法启动 但是app正常安装了

此时可以运行一下直接启动Metro服务器的命令，看一下有无报错

npx react-native start

我当时的报错是因为有个package.json的更新，运行npm install即可正常启动Metro

4.原生环境无法启动

windows下配置很麻烦，最终查到的问题是服务器默认8081端口被占用，所以将启动命令改为

npx react-native run-android --port=1234

以及还要运行

adb devices // 结果应该有至少一台是device的
adb reverse tcp:1234 tcp:1234

5.引入@react-native-community/checkbox和@react-native-picker/picker会报错

无法启动，甚至连.gradle clean运行都会报错

最后发现本质上是Could not download kotlin-compiler-embeddable.jar的问题，因为之前换成了阿里的源，移除对本机的gradle源的变更就好了。 blog.csdn.net/qq_37733331…