'glitch in react native clipboard while typing anything into TextInput
is there anyway to handle the input text context menu or detect the paste event. whenever i'm using clipboard functionality it causes the glitch while typing anything because clipboard.getString() awaits each time typing anything into the textbox.
i'm allowing user to enter only 10 digits in the TextInput, if user copies numbers from somewhere and pasted into TextInput it trims the last two digits, i.e. phone number 70XXXXXXXX -> in this case if user copies number which does not have leading +91 or 91 or 0 it works okay, but if number is like this +9170XXXXXXXXXX in this case it trims the last 2 digits and in textInput and it enters like 9170XXXXXX while it should be pasted as 70XXXXXXXX. -> this case is handled but it causes the glitch everytime user types anyting it awaits to check for the clipboard data.
<TextInput
value={this.state.value}
keyboardType="numeric"
maxLength={10}
onChangeText={async (val) => {
let clipData = await Clipboard.getString();
if (clipData) {
let replacedValue = clipData.replace(/ /g, "").slice(-10);
Clipboard.setString("");
this.setState("value", replacedValue);
} else {
this.setState("value", val);
}
}}
/>
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|