Search code examples
javascriptcssreactjsreact-nativeuser-experience

How to create pills input fields in react native?

I'm looking for a way to make "dynamic pills" like the ones below, but in React Native and Redux. https://codepen.io/silkine/pen/pPxJOX

   <div id="container"></div>
    <div class="tim">this codepen is dedicated to
     <a href="https://twitter.com/twholman">@twholman</a> 
    </div>

1) Anyone know what they are called so it's easier to google tutorials?

2) I'm trying to convert the css with gulp and copy paste the JS into RN, but changing react syntax into RN. Getting a lot of errors. Is this a good path? Or do you know a simpler one? Maybe a tutorial somewhere?

Thanks!

Solution
    1. It's called Badge.
    2. You can use UI Kit like react-native-elements or you can check out code of this element in github repo. Use 'children' prop to pass TextInput.