fixed Radio bug

fixed Radio bug
This commit is contained in:
梁灏 2017-01-04 11:03:22 +08:00
parent 184dba1c8e
commit 578ca32537
6 changed files with 42 additions and 7 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 165 KiB

After

Width:  |  Height:  |  Size: 163 KiB

View file

@ -219,9 +219,8 @@
return false;
}
});
// todo
// this.$on('el.form.blur', this.onFieldBlur);
// this.$on('el.form.change', this.onFieldChange);
this.$on('on-form-blur', this.onFieldBlur);
this.$on('on-form-change', this.onFieldChange);
}
}
},

View file

@ -140,9 +140,11 @@
},
handleBlur () {
this.$emit('on-blur');
this.$dispatch('on-form-blur', this.value);
},
handleChange (event) {
this.$emit('on-change', event);
this.$dispatch('on-form-change', this.value);
},
resizeTextarea () {
const autosize = this.autosize;

View file

@ -9,6 +9,7 @@
const prefixCls = 'ivu-radio-group';
export default {
name: 'radioGroup',
props: {
model: {
type: [String, Number],
@ -51,6 +52,7 @@
this.model = data.value;
this.updateModel();
this.$emit('on-change', data.value);
this.$dispatch('on-form-change', data.value);
}
},
watch: {

View file

@ -62,6 +62,7 @@
}
},
ready () {
if (this.$parent && this.$parent.$options.name === 'radioGroup') this.group = true;
if (!this.group) {
this.updateModel();
}
@ -81,6 +82,8 @@
checked: this.checked
});
}
if (!this.group) this.$dispatch('on-form-change', this.selected);
},
updateModel () {
this.selected = this.checked;

View file

@ -1,6 +1,6 @@
<template>
<div style="width: 400px">
<i-form v-ref:form :model="form" :rules="rules" :label-width="50" label-position="right">
<i-form v-ref:form :model="form" :rules="rules" :label-width="100" label-position="right">
<form-item label="邮箱" prop="mail">
<i-input :value.sync="form.mail" placeholder="请输入邮箱">
<Icon type="ios-email-outline" slot="prepend"></Icon>
@ -11,6 +11,25 @@
<Icon type="ios-locked-outline" slot="prepend"></Icon>
</i-input>
</form-item>
<form-item label="radio" prop="single">
<radio :checked.sync="form.single">Single</radio>
</form-item>
<form-item label="radioGroup" prop="group">
<Radio-group :model.sync="form.group">
<Radio value="apple">
<Icon type="social-apple"></Icon>
<span>Apple</span>
</Radio>
<Radio value="android">
<Icon type="social-android"></Icon>
<span>Android</span>
</Radio>
<Radio value="windows">
<Icon type="social-windows"></Icon>
<span>Windows</span>
</Radio>
</Radio-group>
</form-item>
<form-item>
<i-button type="primary" @click="onSubmit('form')">提交</i-button>
</form-item>
@ -24,21 +43,31 @@
return {
form: {
mail: '',
passwd: ''
passwd: '',
single: false,
group: ''
},
rules: {
mail: [
{
required: true, message: '请输入邮箱', trigger: 'blur'
required: true, message: '请输入正确的邮箱', trigger: 'blur', type: 'email'
},
{
min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur'
min: 3, max: 50, message: '长度在 3 到 50 个字符', trigger: 'blur'
},
{
min: 3, max: 50, message: '长度在 3 到 5 个字符', trigger: 'change'
}
],
passwd: [
{
required: true, message: '请输入密码', trigger: 'blur'
}
],
group: [
{
required: true, message: '请单选组'
}
]
}
}