React-native-calendars: ScrollPad error with Agenda

[neebiz]

I am trying to use the component but I get a scrollPad.scrollTo is undefined error as detailed in the attached image. Which of the props are mandatory to use this component? I've been trying to get just a simple version running by only using the items prop.

I am wondering if I need to update some other library or something. My package.json file tells me I am using the following:
"react-native": "https://github.com/expo/react-native/archive/sdk-37.0.1.tar.gz",
"react-native-calendars": "^1.282.0",
"expo": "~37.0.3",
"react": "~16.9.0",

I've been trying to load this on a real iPhone 7 device.

Any help appreciated!

[chenei]

Can you please paste a code snippet?

[jpgarcia99]

I am also getting this error and it is a new issue.

[chenei]

@jpgarcia99 Can you please explain how to reproduce the bug?

[neebiz]

Thanks for your help and feedback. Calendar and CalendarList worked straight away but I am really struggling with this scrollPad error for the Agenda component. Here is the simple screen I am trying to run:

import React from 'react';
import {View, StyleSheet, Text} from 'react-native';
import {Agenda} from 'react-native-calendars';

const DiaryHomeScreen = () => {
return (
items={{
'2020-06-01': [{name: 'item 1 - any js object'}],
'2012-06-02': [{name: 'item 2 - any js object'}]
}}
renderItem={(item, firstItemInDay) => {
return (

I am here!

);
}}
/>

);
};

const styles = StyleSheet.create({
container: {
backgroundColor: 'white'
}
});

export default DiaryHomeScreen;

[neebiz]

Sorry using the code insert function this time to make sure some of my tags don't get removed:

`import React from 'react';
import {View, StyleSheet, Text} from 'react-native';
import {Agenda} from 'react-native-calendars';

const DiaryHomeScreen = () => {
return (
items={{
'2020-06-01': [{name: 'item 1 - any js object'}],
'2012-06-02': [{name: 'item 2 - any js object'}]
}}
renderItem={(item, firstItemInDay) => {
return (

I am here!

);
}}
/>

);
};

const styles = StyleSheet.create({
container: {
backgroundColor: 'white'
}
});

export default DiaryHomeScreen;
`

[neebiz]

Huh my View and Text tags around 'I am here!' keep getting removed but hopefully you get the idea!

[brunokiafuka]

@chenei, I am currently having the same issue, I am using the Expo SDK ~37.0.3. I tried to use earlier versions but the issue persists, any advice on that?

[sterfanno]

I have the same problem with the expo. I tried all versions. Created an empty expo project, added the example and this problem happened.

[chenei]

Hi all,
This is an issue with expo 37.
Expo 37 uses React Native 0.61. We already updated our library to 0.62.

In RN 0.62, a new warning is introduced:
https://stackoverflow.com/questions/60910385/upgraded-to-react-native-0-62-0-getting-warning-sign-calling-getnode-on-t

We remove getNode() to remove the warning but this causes Expo 37 not to work.

[brunokiafuka]

Hi, I've downgraded to [email protected] and it is working fine on my side. I hope the Expo team can update the next SDK using RN 0.62.

[chenei]

Fixed in 1.287.0.

[neebiz]

Hi Chen, really appreciate the fix!

I upgraded to 1.287.0 but unfortunately I am still getting the scrollTo not a function error. Below are the dependencies in my package.json file:
"dependencies": {
"@react-native-community/masked-view": "^0.1.6",
"@react-navigation/material-top-tabs": "^5.2.9",
"expo": "~37.0.3",
"react": "~16.9.0",
"react-dom": "~16.9.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-37.0.1.tar.gz",
"react-native-calendars": "^1.287.0",
"react-native-gesture-handler": "~1.6.0",
"react-native-reanimated": "~1.7.0",
"react-native-safe-area-context": "0.7.3",
"react-native-screens": "~2.2.0",
"react-native-tab-view": "^2.14.2",
"react-native-web": "~0.11.7",
"react-navigation": "^4.3.9",
"react-navigation-stack": "^2.5.1",
"react-navigation-tabs": "^2.8.13"
},

Any other help or ideas much appreciated.

Thanks!

[brunokiafuka]

@neebiz try run yarn add [email protected] or npm install

[neebiz]

Thanks for the advice but I've tried that and I can see I have the new version in my package.json file but I still get the same error. I've also tried uninstalling the module then reinstalling it. This is a real shame as the Agenda component looks awesome.

[brunokiafuka]

@neebiz Ensure that your dependency on package.json looks like this instead "react-native-calendars": "1.287.0" of "react-native-calendars": "^1.287.0",

[neebiz]

Thanks all. After playing with the package dependencies a little I managed to get it working with the new released version. Thanks again!

Sent from Yahoo Mail for iPhone

On Saturday, June 6, 2020, 11:49 pm, Bruno Kiafuka [e-mail] wrote:

Ensure that your dependency on package.json looks like this instead "react-native-calendars": "1.287.0" of "react-native-calendars": "^1.287.0",

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub, or unsubscribe.