React Native中export default导出tempData报错求助

嘿，刚看完你的代码，发现几个新手容易踩的坑，应该就是这些导致了错误，咱们一个个来修复：

• tempdata.js的导出语法不规范
  你当前的导出写法export default tempData = [...]没有先声明变量，在严格模式下会抛出「未声明变量」的错误。同时还发现todos里的键名写错成了titile，后续处理todo项时肯定会出问题，一起改掉：
  修改后的tempdata.js代码：

  const tempData = [
    {
      name: "Plan a trip",
      color: "#24A6D9",
      todos: [
        { title: "Book Flight", completed: false },
        { title: "Passport Check", completed: true },
        { title: "Reserve Hotel Room", completed: true },
        { title: "Pack Luggage", completed: false }
      ]
    },
    {
      name: "Errands",
      color: "#8022D9",
      todos: [
        { title: "Buy Milk", completed: false },
        { title: "Plan weekend camping trip", completed: true },
        { title: "Run 2 miles", completed: true },
        { title: "Make a Video", completed: true }
      ]
    },
    {
      name: "Birthday Party",
      color: "#595BD9",
      todos: [
        { title: "Get Balloons", completed: false },
        { title: "Send Invitations", completed: true },
        { title: "Make Dinner Reservations", completed: true }
      ]
    }
  ];
  
  export default tempData;
  

• App.js误用了Web标签，React Native不支持
  React Native没有<div>、<text>这类Web端的标签，必须使用它提供的原生组件：

  1. 把FlatList外层的<div>替换成<View>
  2. 把渲染项里的小写<text>替换成React Native的<Text>（注意首字母大写）

• 修改后的App.js关键渲染部分
  这是修复后的FlatList区域代码：

  <View style={{height: 275, paddingLeft: 32}}>
    <View> {/* 替换原有的div */}
      <FlatList
        data={tempData}
        keyExtractor={item => item.name}
        horizontal={true}
        showsHorizontalScrollIndicator={false}
        renderItem={({ item }) => (
          <View>
            <Text>{item.name}</Text> {/* 替换原有的text */}
          </View>
        )}
      />
    </View>
  </View>
  

最后再确认下@expo/vector-icons是否已经通过expo install @expo/vector-icons安装完成，要是之前没装的话也会报错。按上面的修改调整后，应该就能正常渲染tempData里的列表内容了。

内容的提问来源于stack exchange，提问作者priyank rawat