ReactJS：掩碼輸入

我想用ReactJS創建一個屏蔽的輸入組件。正在關注Mask card number input in React我收到錯誤：對象不支持屬性或方法'掩碼'。ReactJS：掩碼輸入

我不得不做一些更改，因爲它似乎後可能有點過時，所以也許還有其他事情我需要改變，我不知道。

這是我的組件：

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="" /> 
    } 
}

所以，我想我是缺少jQuery的面具插件，我與

npm install --save jquery-mask-plugin

安裝於是我改變了這一行：

import $ from 'jquery-mask-plugin';

但是，現在我收到此錯誤消息：

let $input_elem = $(ReactDOM.findDOMNode(this.maskedInput))[0];

錯誤：功能預計

我試圖在最後移除該指數，但沒有幫助。

來源

2017-04-05 roca323

似乎你在'componentDidMount'這裏有個問題：'$ input_elem.input mask（「0000 0000 0000 0000」）;''input'和'mask'之間有空格 –

感謝Mike Driver。我的第一篇文章有一個錯字。我只是修復它。我仍然得到我提到的相同的錯誤 – roca323

嘗試'讓$ input_elem = $（ReactDOM.findDOMNode（this.maskedInput））;'沒有'[0]' –

我想創建自己的組件，以避免安裝第三方庫，但因爲我將不得不安裝jquery這個解決方案，不妨安裝react-maskedinput已經解決了這個問題，這是React比jquery更好的選擇。

來源

2017-04-10 16:20:07 roca323

的jQuery沒有默認mask方法，所以我覺得你還沒有包括this插件編寫

來源

2017-04-05 17:05:20

ReactJS：掩碼輸入

回答

相關問題