support Radio

support Radio
This commit is contained in:
梁灏 2017-03-01 17:01:22 +08:00
parent fc7ef07216
commit 06322514c6
13 changed files with 77 additions and 214 deletions

View file

@ -39,6 +39,7 @@
}
export default {
name: 'Affix',
props: {
offsetTop: {
type: Number,

View file

@ -9,6 +9,7 @@
const prefixCls = 'ivu-btn-group';
export default {
name: 'buttonGroup',
props: {
size: {
validator (value) {

View file

@ -12,6 +12,7 @@
const prefixCls = 'ivu-btn';
export default {
name: 'Button',
components: { Icon },
props: {
type: {

View file

@ -5,6 +5,7 @@
const prefixCls = 'ivu-icon';
export default {
name: 'Icon',
props: {
type: String,
size: [Number, String],

View file

@ -48,6 +48,7 @@
const prefixCls = 'ivu-input';
export default {
name: 'Input',
props: {
type: {
validator (value) {

View file

@ -11,7 +11,7 @@
export default {
name: 'radioGroup',
props: {
model: {
value: {
type: [String, Number],
default: ''
},
@ -30,6 +30,11 @@
default: false
}
},
data () {
return {
currentValue: this.value
}
},
computed: {
classes () {
return [
@ -42,27 +47,29 @@
];
}
},
compiled () {
this.updateModel();
mounted () {
this.updateValue();
},
methods: {
updateModel () {
const model = this.model;
updateValue () {
const value = this.value;
this.$children.forEach((child) => {
child.selected = model == child.value;
child.currentValue = value == child.label;
child.group = true;
});
},
change (data) {
this.model = data.value;
this.updateModel();
this.currentValue = data.value;
this.updateValue();
this.$emit('input', data.value);
this.$emit('on-change', data.value);
this.$dispatch('on-form-change', data.value);
// todo
// this.$dispatch('on-form-change', data.value);
}
},
watch: {
model () {
this.updateModel();
value () {
this.updateValue();
}
}
};

View file

@ -6,31 +6,32 @@
type="radio"
:class="inputClasses"
:disabled="disabled"
:checked="selected"
:checked="currentValue"
@change="change">
</span><slot>{{ value }}</slot>
</span><slot>{{ label }}</slot>
</label>
</template>
<script>
const prefixCls = 'ivu-radio';
export default {
name: 'Radio',
props: {
checked: {
value: {
type: Boolean,
default: false
},
label: {
type: [String, Number]
},
disabled: {
type: Boolean,
default: false
},
value: {
type: [String, Number]
}
},
data () {
return {
selected: false,
currentValue: this.value,
group: false
};
},
@ -40,7 +41,7 @@
`${prefixCls}-wrapper`,
{
[`${prefixCls}-group-item`]: this.group,
[`${prefixCls}-wrapper-checked`]: this.selected,
[`${prefixCls}-wrapper-checked`]: this.currentValue,
[`${prefixCls}-wrapper-disabled`]: this.disabled
}
];
@ -49,7 +50,7 @@
return [
`${prefixCls}`,
{
[`${prefixCls}-checked`]: this.selected,
[`${prefixCls}-checked`]: this.currentValue,
[`${prefixCls}-disabled`]: this.disabled
}
];
@ -61,10 +62,10 @@
return `${prefixCls}-input`;
}
},
ready () {
mounted () {
if (this.$parent && this.$parent.$options.name === 'radioGroup') this.group = true;
if (!this.group) {
this.updateModel();
this.updateValue();
}
},
methods: {
@ -73,25 +74,27 @@
return false;
}
this.selected = event.target.checked;
this.checked = this.selected;
const checked = event.target.checked;
this.currentValue = checked;
this.$emit('input', checked);
this.$emit('on-change', checked);
if (this.group && this.checked) {
if (this.group && this.label) {
this.$parent.change({
value: this.value,
checked: this.checked
value: this.label,
checked: this.value
});
}
if (!this.group) this.$dispatch('on-form-change', this.selected);
// todo
// if (!this.group) this.$dispatch('on-form-change', checked);
},
updateModel () {
this.selected = this.checked;
updateValue () {
this.currentValue = this.value;
}
},
watch: {
checked () {
this.updateModel();
value () {
this.updateValue();
}
}
};