最近小程序支付的時候遇到了一個bug 原因大概就是用戶的名稱中含有emoji表情寂屏,導(dǎo)致后端接口掉不起來 析校。于是就加了需求在輸入姓名時不允許輸入表情符號鳞尔。
剛開始想的是在Input輸入框的bindInput方法中使用正則校驗每次輸入的值(正則具體規(guī)則就不說了,給大家放在下面)朴译,如果為true則直接return,不進(jìn)行賦值操作属铁,若為false則繼續(xù)正常賦值
這樣子邏輯上是沒什么問題,但是小程序大家都知道躬翁,坑太多了
雖然是按照我們預(yù)計流程中進(jìn)行了提示并且沒有進(jìn)行賦值操作焦蘑,這時候打印我們所賦值的變量是為空的,但是輸入框中卻顯示了我們所輸入的符號盒发,這樣我們的產(chǎn)品大大肯定是不同意的例嘱,想了想可以這樣解決,上面的代碼不變宁舰,我們首先在bingInput方法中獲取到已經(jīng)輸入的綁定對象的值拼卵,這時候?qū)φ谳斎氲闹颠M(jìn)行正則校驗,如果該輸入的值為emoji表情蛮艰,則把我們開頭拿到的值setData進(jìn)行重新賦值腋腮,這樣就我們在輸入框里的數(shù)據(jù)就是輸入表情之前的數(shù)據(jù)了,就解決了輸入框中沒有進(jìn)行賦值卻顯示表情的問題壤蚜。
不過唯一美中不足的就是輸入框進(jìn)行了重新賦值會閃爍一下即寡,不過這并無大礙,對我們產(chǎn)品大大來說也是可以接受的袜刷!
好了 今天的分享就到此結(jié)束了 大家如果有什么別的好的方法也可以評論探討一下
正則:
/[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\u200D|\uFE0F]|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF]|[0-9|*|#]\uFE0F\u20E3|[0-9|#]\u20E3|[\u203C-\u3299]\uFE0F\u200D|[\u203C-\u3299]\uFE0F|[\u2122-\u2B55]|\u303D|[\A9|\AE]\u3030|\uA9|\uAE|\u3030/gi