RadioGroup add vertical props
RadioGroup add vertical props
This commit is contained in:
parent
a404bbaed3
commit
5722a6fb91
4 changed files with 20 additions and 10 deletions
|
@ -24,6 +24,10 @@
|
||||||
validator (value) {
|
validator (value) {
|
||||||
return oneOf(value, ['button']);
|
return oneOf(value, ['button']);
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
vertical: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
@ -32,7 +36,8 @@
|
||||||
`${prefixCls}`,
|
`${prefixCls}`,
|
||||||
{
|
{
|
||||||
[`${prefixCls}-${this.size}`]: !!this.size,
|
[`${prefixCls}-${this.size}`]: !!this.size,
|
||||||
[`${prefixCls}-${this.type}`]: !!this.type
|
[`${prefixCls}-${this.type}`]: !!this.type,
|
||||||
|
[`${prefixCls}-vertical`]: this.vertical
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
|
|
@ -6,6 +6,13 @@
|
||||||
.@{radio-group-prefix-cls} {
|
.@{radio-group-prefix-cls} {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
font-size: @font-size-small;
|
font-size: @font-size-small;
|
||||||
|
&-vertical{
|
||||||
|
.@{radio-prefix-cls}-wrapper {
|
||||||
|
display: block;
|
||||||
|
height: 30px;
|
||||||
|
line-height: 30px;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 普通状态
|
// 普通状态
|
||||||
|
@ -16,6 +23,10 @@
|
||||||
position: relative;
|
position: relative;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
margin-right: 8px;
|
margin-right: 8px;
|
||||||
|
cursor: pointer;
|
||||||
|
&-disabled{
|
||||||
|
cursor: @cursor-disabled;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.@{radio-prefix-cls} {
|
.@{radio-prefix-cls} {
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<Checkbox>hello</Checkbox>
|
<Radio-group :model.sync="phone" vertical>
|
||||||
<Radio-group :model.sync="phone">
|
|
||||||
<Radio value="apple">
|
<Radio value="apple">
|
||||||
<Icon type="social-apple"></Icon>
|
<Icon type="social-apple"></Icon>
|
||||||
<span>Apple</span>
|
<span>Apple</span>
|
||||||
|
@ -27,7 +26,7 @@
|
||||||
<i-button @click="radio = !radio">change radio</i-button>
|
<i-button @click="radio = !radio">change radio</i-button>
|
||||||
<br>
|
<br>
|
||||||
<br>
|
<br>
|
||||||
<Radio-group :model.sync="phone" type="button">
|
<Radio-group :model.sync="phone" type="button" vertical>
|
||||||
<Radio value="apple">
|
<Radio value="apple">
|
||||||
<Icon type="social-apple"></Icon>
|
<Icon type="social-apple"></Icon>
|
||||||
<span>Apple</span>
|
<span>Apple</span>
|
||||||
|
|
|
@ -1,11 +1,6 @@
|
||||||
<style>
|
|
||||||
body{
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
<template>
|
<template>
|
||||||
<i-table border :columns="columns1" :data="data1"></i-table>
|
<i-table border :columns="columns1" :data="data1"></i-table>
|
||||||
<i-table border height="200" :columns="columns1" :data="data2"></i-table>
|
<!--<i-table border height="200" :columns="columns1" :data="data2"></i-table>-->
|
||||||
<!--<i-table width="550" height="200" border :columns="columns2" :data="data4"></i-table>-->
|
<!--<i-table width="550" height="200" border :columns="columns2" :data="data4"></i-table>-->
|
||||||
<!--<i-button @click="changeFilter">改变filter</i-button>-->
|
<!--<i-button @click="changeFilter">改变filter</i-button>-->
|
||||||
<!--<span v-if="currentRow !== null">Current Row: {{currentRow.name}}</span>-->
|
<!--<span v-if="currentRow !== null">Current Row: {{currentRow.name}}</span>-->
|
||||||
|
|
Loading…
Add table
Reference in a new issue