美文网首页
JS限制输入表情

JS限制输入表情

作者: _静夜听雨_ | 来源:发表于2023-02-07 16:54 被阅读0次

    记录一下,用到的input输入框限制表情的输入

    class Input extends React.Component<IProps, IState> {
       private emojiReg =
            /[\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;
    
       onInput = (e) => {
            const { maxLen = 0 } = this.props;
            const value =
                (e.target.value &&
                    e.target.value
                        .replace(/^\s+/, "")
                        .replace(this.emojiReg, "")) ||
                "";
            if (this.inputRef) {
                this.inputRef.style.cssText = "height: auto";
                this.inputRef.style.cssText = `height: ${e.target.scrollHeight}px`;
            }
            if (maxLen) {
                this.setState({ value: value.slice(0, maxLen) }, () => {
                    this.props.onChange(this.state.value);
                });
            } else {
                this.setState({ value });
                this.props.onChange(value);
            }
        };
      render(){
        ...
      }
    }
    
    

    相关文章

      网友评论

          本文标题:JS限制输入表情

          本文链接:https://www.haomeiwen.com/subject/ouhfkdtx.html