通用组件---输入框禁用特殊字符，限定长度

1.封装的组件如下： 

import React, { Component } from 'react';
import { Input } from "antd";

class InputE extends Component {

  handleChange =(e) =>{
    // console.log(e.target.value);
    const obj={};
    //特殊字符，需要禁用的继续往里添加即可
    const pattern = new RegExp("[`~!@#$^&*()=|{}':;',\\[\\]<>/?~！@#￥……&*（）——|{}    【】‘；：”“'。，、？]");
    if(pattern.test(e.target.value)){
      e.target.value='';
      return false;
    }
    obj[e.target.name] = e.target.value;
    this.setState({
      obj,
    });
  }

  render () {
    const {placeholder, maxLength, name, disabled} = this.props;
    const {obj} = this.state;
    // console.log(obj);
    return (
      <div>
        <Input name={name} placeholder={placeholder} maxLength={maxLength} onChange=                            {this.handleChange} value={obj ? obj[`${name}`] : ''} disabled={disabled} />
      </div>
    )
  }
}

export default InputE;

2.在其他地方使用（注意，只适用于一般地方的输入框，暂不适合编辑修改类）

name属性，请使用不同值

<InputE name="name" placeholder="请输入" maxLength="20" />

import React, { Component } from 'react'

class componentName extends Component {
  render () {
    return (
      <div>
        <InputE name="name1" placeholder="请输入" maxLength="20" />
        <InputE name="name2" placeholder="请输入" maxLength="20" />
        <InputE name="name3" placeholder="请输入" maxLength="20" />
      </div>
    )
  }
}

export default componentName;