Почему я не могу использовать временные данные экспорта по умолчанию в React Native - PullRequest
0 голосов
/ 09 июля 2020

Я использовал временные данные из tempdata. js в приложение. js, но получаю сообщение об ошибке. Пожалуйста, см. Я новичок в реагировании на родной язык и следую руководству. Итак, это простое приложение с задачами. Я пытаюсь использовать временные данные и не могу этого сделать. Пожалуйста помоги. Я следую инструкциям, но все равно получаю сообщение об ошибке. Я использую expo cl

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

Код в приложении. js

import { StatusBar } from 'expo-status-bar';
import React from 'react';
import { StyleSheet, Text, View, TouchableOpacity, FlatList } from 'react-native';
import {AntDesign} from '@expo/vector-icons';
import tempData from './tempData';


export default function App() {
  return (
    <View style={styles.container}>
      <View style={{ flexDirection: "row" }}>
        <View style={styles.divider} />
        <Text style={styles.title}>
          Todo <Text style={{ fontWeight: "300", color: "#24A6D9" }}>Listsss</Text>
        </Text>
        <View style={styles.divider} />
      <StatusBar style="auto" />
      </View>

      <View style={{marginVertical: 48}}>
        <TouchableOpacity style={styles.addList}>
          <AntDesign name="plus" size={16} color={"#24A6D9"} />
         </TouchableOpacity>

         <Text style={styles.add}>Add List</Text>
      </View>
      <View style={{height: 275, paddingLeft: 32}}>
       
          <div>
          
        <FlatList 
          data={tempData}
          keyExtractor={item => item.name}
          horizontal={true}
          showsHorizontalScrollIndicator={false}
          renderItem={({ item }) => (
            <View>
            <text>{item.name}</text>
            </View>
          )}
        />
        </div>
       
      </View>
    </View>
   );

}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
  divider: {
    backgroundColor: "#A7CBD9",
    height: 1,
    flex: 1,
    alignSelf: "center"
  },
  title: {
    fontSize: 38,
    fontWeight: "800",
    color: "#2D3436",
    paddingHorizontal: 64
  },
  addList: {
    borderWidth: 2,
    borderColor: "#A7CBD9",
    borderRadius: 4,
    padding: 16,
    alignItems: "center",
    justifyContent: "center"
  },
  add: {
    color: "#24A6D9",
    fontWeight: "600",
    fontSize: 14,
    marginTop: 8
  }
});

ОШИБКА: введите описание изображения здесь

1 Ответ

0 голосов
/ 09 июля 2020

У вас небольшая синтаксическая ошибка в операторе export default.

Вы можете сделать:

const tempData = [
  // ...
]

export default tempData

или

export default [
  // ...
]
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...