Skip to content
loading...

Use styled-components + ReactNative's FlatList in TypeScript

acro5piano profile image Kay Gosho twitter logo github logo ・1 min read  

To use styled-components + FlatList, we have to write like this:

interface User {
  id: number
  name: string
}

const StyledFlatList = styled(FlatList as new () => FlatList<User>)`
  background-color: #f7f7f7;
`

[edited]
Finally, I added my workaround. I hope someone solve the issue.

https://github.com/styled-components/styled-components/issues/1803#issuecomment-497323287
[/edited]

This is because styled.FlatList does not support by typing definition of styled-components.

see: https://github.com/styled-components/styled-components/issues/1294

Ref: https://github.com/styled-components/styled-components/issues/1803#issuecomment-407332173

twitter logo DISCUSS (10)
Discussion
markdown guide
Classic DEV Post from Jul 26 '19

🎩 JavaScript Enhanced Scss mixins! 🎩 concepts explained

In the next post we are going to explore CSS @apply to supercharge what we talk about here....

Kay Gosho profile image
A Full Stack Developer.