Загрузить JSON элементов данных в календарь React Native Calendar - PullRequest
Новая
       12

Загрузить JSON элементов данных в календарь React Native Calendar

1 голос
/ 05 августа 2020

Я пытаюсь загрузить JSON данные в свою повестку дня календаря, но не могу. Существует не так много документации о том, как загружать JSON в пункты повестки дня, сравнивая их с датами. Кто-нибудь может мне помочь. Это мои JSON данные. Я пытаюсь загрузить элементы на определенную дату, используя поле Agenda_TimeStamp. У меня есть другая страница, на которой я размещаю данные в своей базе данных sql, откуда я беру данные здесь. Я хочу показать содержимое JSON данных по указанным c датам относительно Agenda_Timestamp 

 {
        "AgendaName": null,
        "User_ID": 100,
        "Agenda_DESC": "TEST",
        "Agenda_TIMESTAMP": "2020-08-04 02:44:14",
        "Agenda_TYPE": "CO",
        "Agenda_ID": 100
    }

Я пытаюсь загрузить эти данные в повестку дня, используя этот собственный код реакции 

import axios from 'axios';
import { Calendar, CalendarList, Agenda } from 'react-native-calendars';

const HomeScreen = () => {
useEffect(() => {
        const fetchData = async () => {
            const result = await axios(
                'http://localhost/restservice/Agenda/',
            );

            setData(result.data);
        };

        fetchData();
    }, []);
    const timeToString = (time) => {
        const date = new Date(time);
        return date.toISOString().split('T')[0];
    };

    const [data, setData] = useState([]);
   /*  const [date, setDate] = useState(new Date()); */
    const [items, setItems] = useState([]);
   /*  const onChange = date => {
        setDate(date);
    }; */

    const loadItems =(day) => {
        setTimeout(() => {
            for (let i = -15; i < 85; i++) {
                const time = day.timestamp + i * 24 * 60 * 60 * 1000;
                const strTime = timeToString(time);
                if (!items[strTime]) {
                    items[strTime] = [];
                    const numItems = Math.floor(Math.random() * 3 + 1);
                    for (let j = 0; j < data.count(); j++) {
                        items[strTime].push({
                            name: 'Item for ' + strTime + ' #' + j,
                            height: Math.max(50, Math.floor(Math.random() * 150))
                        });
                    }
                }
    }

            const newItems = {};
            Object.keys(data).forEach(key => { newItems[data.Agenda_id] = data[Agenda_TYPE]; });
            setItems(newItems);
        }, 1000);
    }



    const renderItem = (item) => {
        return (
           
                <TouchableOpacity style={[styles.item, { height: item.height }]}
                    onPress={() => alert(item.name)}>

                    <Text>
                        {item.name}
                    </Text>

                </TouchableOpacity>
   
           

        );
    };


    return (
        <View style={styles.container}>
            <StatusBar barStyle={theme.dark ? "light-content" : "dark-content"} />
         
            <Agenda theme={{
                
            }}
                    items={items}
                    loadItemsForMonth={loadItems}
                    renderItem={renderItem}
                  
                />
           
            
        </View>
    );
};
export default HomeScreen;

1 Ответ

0 голосов
/ 18 августа 2020
• 1000 элементы должны быть примерно такими: 
    items={{
    '2012-05-22': [{name: 'item 1 - any js object'}],
    '2012-05-23': [{name: 'item 2 - any js object', height: 80}],
    '2012-05-24': [],
    '2012-05-25': [{name: 'item 3 - any js object'}, {name: 'any js object'}]
  }}
...