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

React native user tags inside text input

$
0
0

I can't seem to properly figure out how to have formatted user tags that are editable inside of a text input.

For example:

const stateString = "{{ userId:1 }} is feeling great.";

To display a formatted user tag, I take that value, run it through a function, and it outputs "John is feeling great.", where John has a visible background color.

My problem is that on the next onChange trigger of my TextInput, e.nativeEvent.text is "John is feeling great." without any of the formatting.

If I feed that back to the TextInput component directly, I will lose the formatting as it will no longer have {{ userId: 1 }}.

My only option is to take stateString and compare it to e.nativeEvent.text, see what changed, and manually re-inject the user tags in.

The problem with that is that it's complicated (the change can be an added character, removed character, or removed multiple characters), and the fact that you can have John is with John coming from {{ userId:1 }} is with {{ userId:2 }}. Two different people, same first name.

The problem is that I need {{ userId:1 }} to send to the server, so it knows which users are mentioned in the comment.

Any ideas would be appreciated!


Viewing all articles
Browse latest Browse all 6287

Trending Articles



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