如何在react的材料-ui中获取密码字段值 [英] How to get password field value in react's material-ui

问题描述

如果我不写< input type ='，我无法访问< TextField /> 的值密码'/> 然后它工作正常，但为此我得到一个TypeError，' this.refs [this._getRef（...）]。getInputNode不是一个函数'。

I am not able to access the value of <TextField />, if i don't write <input type='password'/> then it works fine, but for this i am getting a TypeError, 'this.refs[this._getRef(...)].getInputNode is not a function'.

 dialogAction(tag,e){

  console.log(this.refs.password);
  console.log(this.refs.password.getValue());
  this.refs.dialog.dismiss();
}

render(){
let self = this;

let row = this.row,col = this.column;
let standardActions = [
  { text: 'Cancel',onTouchTap: this.dialogAction.bind(this,ProductConstants.CANCEL)},
  { text: 'Submit',onTouchTap: this.dialogAction.bind(this,ProductConstants.SUBMIT)}
];

return (
  <div className="ProductRepository">

    <Dialog ref = 'dialog'
      title="Dialog With Standard Actions"
      actions={standardActions}
      actionFocus="submit"
      modal={true}>
      <TextField ref='password'
        hintText="Password"
        floatingLabelText="Password">
        <input type="password" />
      </TextField>
    </Dialog>
    </div> 
    );}

   }

下图是上述代码的控制台输出。

image below is the console output of the above code.

推荐答案

这解决了我的问题：

<TextField ref='password'
    hintText="Password"
    floatingLabelText="Password"
    type="password">
</TextField>

之后

 this.refs.password.getValue()

给出所需的输出。

对于React v> = 15.6

For React v >= 15.6

<TextField ref={x => this.password = x}
    hintText="Password"
    floatingLabelText="Password"
    type="password">
</TextField>

在inputHandler函数中

in inputHandler function

this.password.value

这篇关于如何在react的材料-ui中获取密码字段值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！