question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

styles = {drawerStyles} results in an error in react-native version 0.27

See original GitHub issue

In the example, prop styles = {drawerStyles} results in the error below in react-native version 0.27

simulator screen shot jun 15 2016 6 28 53 pm

I am not sure about the reason, might because drawerStyles.drawer and drawerStyles.main returns IDs instead of objects? But the workaround that puts style object inline works

<Drawer
  type="overlay"
  content={<ControlPanel />}
  tapToClose={true}
  openDrawerOffset={0.2} // 20% gap on the right side of drawer
  panCloseMask={0.2}
  closedDrawerOffset={-3}
  styles={{drawer: { backgroundColor: '#D84042', shadowColor: '#000000', shadowOpacity: 0.8, shadowRadius: 3},main: {paddingLeft: 3}}}
  tweenHandler={(ratio) => ({
    main: { opacity:(2-ratio)/2 }
  })}
  >
    <Main />
</Drawer>
`

Issue Analytics

  • State:open
  • Created 7 years ago
  • Reactions:5
  • Comments:7

github_iconTop GitHub Comments

4reactions
zandzpidercommented, Jun 23, 2016

Would be nice with a fix here

0reactions
kristojorgcommented, Jul 11, 2016

Same +1

Read more comments on GitHub >

github_iconTop Results From Across the Web

ios - this.props is undefined in React Native 0.27 - Stack Overflow
I am new to React, i have implemented react-native-drawer from ... setParentState.bind(this, {drawerType:'overlay'})} style={styles.
Read more >
Drawer Navigator | React Navigation
drawerStyle ​​​ Style object for the drawer component. You can pass a custom background color for a drawer or a custom width here....
Read more >
Error Boundaries - React
Error boundaries are React components that catch JavaScript errors anywhere in their child component tree, log those errors, and display a fallback UI ......
Read more >
React Native Drawer - Example using React Navigation V6
React Native Navigation Drawer for Android and IOS. React Navigation Drawer (Sidebar Menu) with latest react-navigation version V5+.
Read more >
Troubleshooting - React Native
If you encounter an error such as npm WARN locking Error: EACCES while using the React Native CLI, try running the following:.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found