drip-public/iview
6
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fixed #183

Browse source 
fixed #183
This commit is contained in:
梁灏 2017-01-10 19:29:59 +08:00
parent c211f71778
commit 2810d8c78d
3 changed files with 137 additions and 111 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/components/cascader/cascader.vue
View file

@ -87,7 +87,8 @@
prefixCls: prefixCls, prefixCls: prefixCls,
visible: false, visible: false,
selected: [], selected: [],
tmpSelected: [] tmpSelected: [],
updatingValue: false // to fix set value in changeOnSelect type
}; };
}, },
computed: { computed: {
@ -162,6 +163,7 @@
}); });
if (!fromInit) { if (!fromInit) {
this.updatingValue = true;
this.value = newVal; this.value = newVal;
this.emitValue(this.value, oldVal); this.emitValue(this.value, oldVal);
} }
@ -186,7 +188,11 @@
} }
}, },
value () { value () {
this.updateSelected(); if (this.updatingValue) {
this.updatingValue = false;
return;
}
this.updateSelected(true);
} }
} }
}; };

126
test/routers/cascader.vue
View file

@ -1,80 +1,72 @@
<template> <template>
<div v-for="item in list"> <Cascader :data="data" :value.sync="value" change-on-select></Cascader>
<Cascader :data="data" change-on-select :render-format="format"></Cascader>
</div>
<i-button @click="add">add</i-button>
<i-button @click="remove">remove</i-button>
</template> </template>
<script> <script>
export default { export default {
data () { data () {
return { return {
list: [ value: [],
{ data: []
a: 1
}
],
data: [{
value: 'beijing',
label: '北京',
children: [
{
value: 'gugong',
label: '故宫'
},
{
value: 'tiantan',
label: '天坛'
},
{
value: 'wangfujing',
label: '王府井'
}
]
}, {
value: 'jiangsu',
label: '江苏',
children: [
{
value: 'nanjing',
label: '南京',
children: [
{
value: 'fuzimiao',
label: '夫子庙'
}
]
},
{
value: 'suzhou',
label: '苏州',
children: [
{
value: 'zhuozhengyuan',
label: '拙政园'
},
{
value: 'shizilin',
label: '狮子林'
}
]
}
]
}]
} }
}, },
methods: { methods: {
add () { updateData () {
this.list.push({ setTimeout(() => {
a: 2 this.data = [{
}) value: 'beijing',
}, label: '北京',
remove () { children: [
this.list.splice(0, 1); {
}, value: 'gugong',
format (labels) { label: '故宫'
return labels.join(' - '); },
{
value: 'tiantan',
label: '天坛'
},
{
value: 'wangfujing',
label: '王府井'
}
]
}, {
value: 'jiangsu',
label: '江苏',
children: [
{
value: 'nanjing',
label: '南京',
children: [
{
value: 'fuzimiao',
label: '夫子庙'
}
]
},
{
value: 'suzhou',
label: '苏州',
children: [
{
value: 'zhuozhengyuan',
label: '拙政园'
},
{
value: 'shizilin',
label: '狮子林'
}
]
}
]
}];
setTimeout(() => {
this.value = ['beijing', 'tiantan'];
}, 1000);
}, 1000);
} }
},
ready () {
this.updateData();
} }
} }
</script> </script>

112
test/routers/table.vue
View file

@ -1,36 +1,37 @@
<style> <style>
/*.ivu-table .demo-table-info-row td{*/ .ivu-table .demo-table-info-row td{
/*background-color: #2db7f5;*/ background-color: #2db7f5;
/*color: #fff;*/
/*}*/
/*.ivu-table .demo-table-error-row td{*/
/*background-color: #ff6600;*/
/*color: #fff;*/
/*}*/
.ivu-table .table-age-col{
background: #ff6600;
}
.ivu-table .table-name-col{
background: #2db7f5;
}
.ivu-table .table-address-col{
background: #187;
}
.ivu-table .class-cell-age{
background: #187;
color: #fff; color: #fff;
} }
.ivu-table .class-cell-address{ .ivu-table .demo-table-error-row td{
background: #f60; background-color: #ff6600;
color: #fff; color: #fff;
} }
.ivu-table .class-cell-name{ .ivu-table .demo-table-info-column{
background: #2db7f5; background-color: #2db7f5;
color: #fff;
border-bottom: 1px solid #2db7f5;
}
.ivu-table .demo-table-info-cell-name {
background-color: #2db7f5;
color: #fff;
}
.ivu-table .demo-table-info-cell-age {
background-color: #ff6600;
color: #fff;
}
.ivu-table .demo-table-info-cell-address {
background-color: #187;
color: #fff; color: #fff;
} }
</style> </style>
<template> <template>
<p>自定义行样式：</p>
<i-table :row-class-name="rowClassName" :columns="columns1" :data="data1"></i-table> <i-table :row-class-name="rowClassName" :columns="columns1" :data="data1"></i-table>
<p>自定义列样式：</p>
<i-table :columns="columns9" :data="data1"></i-table>
<p>自定义任意单元格样式：</p>
<i-table :columns="columns1" :data="data8"></i-table>
</template> </template>
<script> <script>
export default { export default {
@ -38,37 +39,38 @@
return { return {
columns1: [ columns1: [
{ {
type: 'selection', title: '姓名',
width: 60, key: 'name'
align: 'center'
}, },
{
title: '年龄',
key: 'age'
},
{
title: '地址',
key: 'address'
}
],
columns9: [
{ {
title: '姓名', title: '姓名',
key: 'name', key: 'name'
// fixed: 'right',
// className: 'table-name-col'
}, },
{ {
title: '年龄', title: '年龄',
key: 'age', key: 'age',
// fixed: 'right', className: 'demo-table-info-column'
// className: 'table-age-col'
}, },
{ {
title: '地址', title: '地址',
key: 'address', key: 'address'
// className: 'table-address-col'
} }
], ],
data1: [ data1: [
{ {
name: '王小明', name: '王小明',
age: 18, age: 18,
address: '北京市朝阳区芍药居', address: '北京市朝阳区芍药居'
cellClassName: {
age: 'class-cell-age',
address: 'class-cell-address'
}
}, },
{ {
name: '张小刚', name: '张小刚',
@ -78,16 +80,42 @@
{ {
name: '李小红', name: '李小红',
age: 30, age: 30,
address: '上海市浦东新区世纪大道', address: '上海市浦东新区世纪大道'
cellClassName: {
name: 'class-cell-name'
}
}, },
{ {
name: '周小伟', name: '周小伟',
age: 26, age: 26,
address: '深圳市南山区深南大道' address: '深圳市南山区深南大道'
} }
],
data8: [
{
name: '王小明',
age: 18,
address: '北京市朝阳区芍药居'
},
{
name: '张小刚',
age: 25,
address: '北京市海淀区西二旗',
cellClassName: {
age: 'demo-table-info-cell-age',
address: 'demo-table-info-cell-address'
}
},
{
name: '李小红',
age: 30,
address: '上海市浦东新区世纪大道'
},
{
name: '周小伟',
age: 26,
address: '深圳市南山区深南大道',
cellClassName: {
name: 'demo-table-info-cell-name'
}
}
] ]
} }
}, },