代码之家 › 专栏 › 技术社区 › tatsu

粘贴到输入字段时,反应捕捉并删除换行符或新行

react-native reactjs javascript

0

tatsu · 技术社区 · 9 年前

我的输入字段只是一个输入字段,而不是一个输入框,继承下来的事实是,你不能在其中创建新行,这是我想要的,也是我想要的。

我在愚弄我的应用程序。

如果Jhon Dumb ctrl-V的文本包含新行(或我的规则集以外的任何其他内容),我如何防止它触发更新事件并落入 !== '' 案例

规则集:

 const validator = /^(?!.*\.\.)(?!.*\-\-)(?!.*\.$)[^\W\_][A-Z0-9\.\-\_]{0,50}$/igm;
 const allow = validator.test(inputValue);
 if (allow) {
 ...do stuff
 }

我试过这个(放在验证器上面):

const inputValue = event.target.value.replace(/\n/g, '').toUpperCase();

regex - replace multi line breaks with single in javascript

但是 inputValue 在经历了这一切之后 === '' (碰巧是有效的)所以UpdateInput代码仍然被执行。

但现在的结果是,用户得到的视觉反馈是,他的输入正在更新,但其内容是空的。(很明显,但我不能说是谁在干预,以及我们从中得到了什么。) MY_INPUT\n 至===> (事实上,我很想知道它为什么这样做)。


   
    也许这是react已经过滤掉了不正确的输入,但在这种情况下,我需要一种方法来阻止任何代码执行。
   
   
    理想情况下,尽管我会“纠正”用户输入。
   
   
    为了澄清:

1 回复 | 直到 9 年前

1

2

JR Halchak 9 年前

输入元素应已剥离 \n 从任何文本。

从…起 MDN

单行文本字段。换行符将自动从输入值中删除。

如果问题是你在检查 '' .trim()

if (inputValue.trim() !== '') {}

if (!inputValue.trim()) 因为空字符串是假的,如果它符合您的风格。