Question

我正在尝试使用ReactJS创建一个蒙版的输入组件。关注Mask card number input in React我收到错误：对象不支持属性或方法＆＃39;掩盖＆＃39;。

我确实需要进行一些更改，因为它似乎有点过时，所以也许还有其他我需要改变的东西，我不知道。

这是我的组成部分：

DataGrid

所以，我想我错过了jquery-mask-plugin，我用

安装

import React, { Component } from 'react';
import ReactDOM from 'react-dom'
import $ from 'jquery';

export default class MaskedInput extends Component {
    constructor(props) {
        super(props); 
    }

    componentDidMount() {
        let $input_elem = $(ReactDOM.findDOMNode(this.maskedInput))[0];
        console.log($input_elem);
//      // now you have a jquery object
        $input_elem.mask("0000 0000 0000 0000");
    }

    render() {
        return <input ref={(input)=> {this.maskedInput = input; }} id="cardInput" onChange={this.props.handleChange} type="number" value="" />
    }
}

所以我改变了这一行：

npm install --save jquery-mask-plugin

但是，现在我在这一行上收到错误：

import $ from 'jquery-mask-plugin';

错误：预期功能

我尝试在最后删除索引，但这没有帮助。

Answer 1

jQuery默认没有mask方法，所以我认为你没有将this插件包含在代码中

Answer 2

我想创建自己的组件以避免安装第三方库，但由于我必须为此解决方案安装jquery，不妨安装react-maskedinput已经解决了问题，这是一个更好的选择对于React而不是jquery。

ReactJS：掩码输入

2 个答案: