Search code examples
reactjsreact-nativeexpostyled-componentsemotion

React Native - @emotion/native - TextInput placeholder text color attribute


I am trying to pass the placeholderTextColor attribute through the styled.TextInput.attrs function. The reason why I'm doing this is so I can access the theme props.

This is what I have:

const TextInput = styled.TextInput.attrs(props => ({
  placeholderTextColor: "red",
  type: "password"
}))`
  color: ${({ theme }) => theme.colors.text};
`

But I am getting the following error:

_native.default.TextInput.attrs is not a function. (In '_native.default.TextInput.attrs(function (props) {
    return {
      placeholderTextColor: "red",
      type: "password"
    };
  })', '_native.default.TextInput.attrs' is undefined)

Solution

  • I guess @emotion/native does not support the attrs function yet, so I moved over to styled-components.