vue代码实现input输入框自动生成8位随机密码并绑定值
//我这里使用的是vue ant design组件 ,与elementUI其实大同小异
<a-row :gutter="16" class="inputTop">
<a-col :span="24">
<a-form-item label="密码">
<a-input
type="text" @click="passBuid(1)"//这是随机生成密码的方法,通过v-on绑定调用,我这里有传递一个参数,是因为 在项目中表单项有多处,需要进行判断,如果只有一张表单可不传递参数。
v-decorator="[
'password',
{
rules: [
{
required: true,
//因为是随机生成8位的密码,所有对密码的校验就省去了
/* message:
'请填写4-16位由英文或数字组成的密码!'*/
},
{
/* validator: comparePassword*/
}
]
}
]"
/>
</a-form-item>
</a-col>
</a-row>
//下面是随机生成密码的方法
passBuid(type){
let values = this.form.getFieldsValue();
if (type === 1){
values = this.form.getFieldsValue();
}else if (type === 2){
values = this.form2.getFieldsValue();
}
console.log(values.password);//调试 打印
if (values.password !== undefined && values.password !== ''){
return;
}
//随机生成密码的逻辑代码
let chars = 'ABCDEFGHIJKLMNOPQRSTUVWSYZabcdefghijklmnopqrstuvwsyz0123456789';//这里没有加其他字符,需要可自行添加
let tempLen = chars.length;
let tempStr='';
for(let i=0; i<8; ++i){
tempStr += chars.charAt(Math.floor(Math.random() * tempLen ));
}
if (type === 1){
this.form.setFieldsValue({
password: tempStr || "",//这里是将得到的随机密码塞到input输入框中
});
}else if (type === 2){
this.form2.setFieldsValue({
password: tempStr || "",
});
}
}
版权声明:本文为weixin_42621430原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。