Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

Using types in Styled Component in Typescript

$
0
0

So, I'm working with React Native and never used Styled Components before.
When I'm creating a new component without SC, such a custom button, I do the following:

import React, { ReactNode } from 'react'import { TouchableOpacity, TouchableOpacityProps} from 'react-native'import styles from './styles'type CustomButtonProps = TouchableOpacityProps & {  children: ReactNode }const CustomButton = ({ children, ...props }: CustomButtonProps) => {  return (<TouchableOpacity style={styles.container} {...props}>      {children}</TouchableOpacity>  )}export { CustomButton }

This way, when I'm using my component in other place, I can pass all aditional TouchableOpacity props that's not listed in my custom props.

I want to know what type I use to replace the TouchableOpacityProps when I'm using Styled Components to continue using the non-listed props, as, if I use TouchableOpacityProps, it gets me an error saying the types doesn't match:

import React, { ReactNode } from 'react'import { StyledTouchableOpacity } from './styles'type CustomButtonProps = ??? & {  children: ReactNode }const CustomButton = ({ children, ...props }: CustomButtonProps) => {  return (<StyledTouchableOpacity {...props}>      {children}</StyledTouchableOpacity>  )}export { CustomButton }

Thank you :)


Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>