oblador / react-native-collapsible

Animated collapsible component for React Native, good for accordions, toggles etc
MIT License
2.43k stars 453 forks source link

TypeError: Cannot read property 'style' of undefined #373

Closed moedeveloper closed 3 years ago

moedeveloper commented 3 years ago

Feels like the packages is not working anymore with the lates updates?

Regards,

TypeError: Cannot read property 'style' of undefined Module.../../../../../../../Desktop/demo/react-actionsheet-example/node_modules/react-native-collapsible/Collapsible.js node_modules/react-native-collapsible/Collapsible.js:16 13 | enablePointerEvents: PropTypes.bool, 14 | duration: PropTypes.number, 15 | easing: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),

16 | style: ViewPropTypes.style, | ^ 17 | onAnimationEnd: PropTypes.func, 18 | children: PropTypes.node, 19 | };

moedeveloper commented 3 years ago

import { View, Text } from 'react-native';
import Accordion from 'react-native-collapsible/Accordion';

const SECTIONS = [
  {
    title: 'First',
    content: 'Lorem ipsum...',
  },
  {
    title: 'Second',
    content: 'Lorem ipsum...',
  },
];

export default function TabOneScreen() {

  const [activeSection, setActiveSection] = useState([]);

  const _renderSectionTitle = (section: any) => {
    return (
      <View>
        <Text>{section.title}</Text>
      </View>
    );
  }
  const _renderHeader = (section: any) => {
    return (
      <View>
        <Text>{section.title}</Text>

      </View>
    );
  }
  const _renderContent = (section: any) => {
    return (
      <View>
        <Text>{section.content}</Text>

      </View>
    );
  }
  const _updateSections = (activeSection: any) => {
    setActiveSection(activeSection)
  }
  return (
    <Accordion
      sections={SECTIONS}
      activeSections={activeSection}
      renderSectionTitle={_renderSectionTitle}
      renderHeader={_renderHeader}
      renderContent={_renderContent}
      onChange={_updateSections}
    />
  );
}```
i am still getting same error
kgrech commented 3 years ago

Looks like it is related to https://github.com/necolas/react-native-web/issues/1537

kgrech commented 3 years ago

@oblador Looks like this is a blocker to use react-native-collapsible with react-native-web 0.12.0 and above due to breakable change they have made.

Luckily it looks like there is an easy fix available. I've raised a PR#384 Would you have some time to merge and release?

kgrech commented 3 years ago

Ah, I just noticed there is already a proper fix for it here https://github.com/oblador/react-native-collapsible/pull/365

oblador commented 3 years ago

Fixed in 1.6.0