mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-06-13 04:53:11 +08:00
Code Issues Actions 22 Packages Projects Releases Wiki Activity

fix: forbid copy paste event on password validation, and optimize the interacitve.

Browse Source
This commit is contained in:
SimaQ 2015-08-20 18:56:21 +08:00
parent 0a2424f52a
commit 680b36c3e9
2 changed files with 16 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
components/validation/demo/basic.md
View File

@ -28,6 +28,10 @@ function cx(classNames) {
} }
} }
function noop() {
return false;
}
var Form = React.createClass({ var Form = React.createClass({
mixins: [Validation.FieldMixin], mixins: [Validation.FieldMixin],
@ -122,6 +126,10 @@ var Form = React.createClass({
}, },
checkPass(rule, value, callback) { checkPass(rule, value, callback) {
if (this.state.formData.passwd) {
this.refs.validation.forceValidate(['rePasswd']);
}
callback(); callback();
}, },
@ -203,7 +211,7 @@ var Form = React.createClass({
<div className="col-12"> <div className="col-12">
<div className={this.renderValidateStyle('passwd')}> <div className={this.renderValidateStyle('passwd')}>
<Validator rules={[{required: true, whitespace: true, message: '请填写密码'}, {validator: this.checkPass}]}> <Validator rules={[{required: true, whitespace: true, message: '请填写密码'}, {validator: this.checkPass}]}>
<input name="passwd" id="password" className="ant-input" type="password" value={formData.passwd}/> <input name="passwd" id="password" className="ant-input" type="password" onContextMenu={noop} onPaste={noop} onCopy={noop} onCut={noop} autocomplete="off" value={formData.passwd}/>
</Validator> </Validator>
{status.passwd.errors ? <div className="ant-form-explain">{status.passwd.errors.join(',')}</div> : null} {status.passwd.errors ? <div className="ant-form-explain">{status.passwd.errors.join(',')}</div> : null}
</div> </div>
@ -219,7 +227,7 @@ var Form = React.createClass({
whitespace: true, whitespace: true,
message: '请再次输入密码' message: '请再次输入密码'
}, {validator: this.checkPass2}]}> }, {validator: this.checkPass2}]}>
<input name="rePasswd" id="password2" className="ant-input" type="password" value={formData.rePasswd} placeholder="两次输入密码保持一致"/> <input name="rePasswd" id="password2" className="ant-input" type="password" onContextMenu={noop} onPaste={noop} onCopy={noop} onCut={noop} autocomplete="off" value={formData.rePasswd} placeholder="两次输入密码保持一致"/>
</Validator> </Validator>
{status.rePasswd.errors ? <div className="ant-form-explain"> {status.rePasswd.errors.join(', ')}</div> : null} {status.rePasswd.errors ? <div className="ant-form-explain"> {status.rePasswd.errors.join(', ')}</div> : null}
</div> </div>

8
components/validation/demo/customize.md
View File

@ -22,6 +22,10 @@ function cx(classNames) {
} }
} }
function noop() {
return false;
}
var Form = React.createClass({ var Form = React.createClass({
mixins: [Validation.FieldMixin], mixins: [Validation.FieldMixin],
@ -154,7 +158,7 @@ var Form = React.createClass({
<div className="col-10"> <div className="col-10">
<div className={this.renderValidateStyle('pass', false)}> <div className={this.renderValidateStyle('pass', false)}>
<Validator rules={[{required: true, whitespace: true, message: '请填写密码'}, {validator: this.checkPass}]} trigger="onChange"> <Validator rules={[{required: true, whitespace: true, message: '请填写密码'}, {validator: this.checkPass}]} trigger="onChange">
<input name="pass" id="confirmPass" className="ant-input" type="password" value={formData.pass}/> <input name="pass" id="confirmPass" className="ant-input" type="password" onContextMenu={noop} onPaste={noop} onCopy={noop} onCut={noop} autocomplete="off" value={formData.pass}/>
</Validator> </Validator>
{status.pass.errors ? <div className="ant-form-explain">{status.pass.errors.join(',')}</div> : null} {status.pass.errors ? <div className="ant-form-explain">{status.pass.errors.join(',')}</div> : null}
</div> </div>
@ -173,7 +177,7 @@ var Form = React.createClass({
whitespace: true, whitespace: true,
message: '请再次输入密码' message: '请再次输入密码'
}, {validator: this.checkPass2}]}> }, {validator: this.checkPass2}]}>
<input name="rePass" id="confirmPass2" className="ant-input" type="password" value={formData.rePass}/> <input name="rePass" id="confirmPass2" className="ant-input" type="password" onContextMenu={noop} onPaste={noop} onCopy={noop} onCut={noop} autocomplete="off" value={formData.rePass}/>
</Validator> </Validator>
{status.rePass.errors ? <div className="ant-form-explain"> {status.rePass.errors.join(', ')}</div> : null} {status.rePass.errors ? <div className="ant-form-explain"> {status.rePass.errors.join(', ')}</div> : null}
</div> </div>