1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 | <template>
<Table border :columns= "columns6" :data= "data5" @on-row-click= "(row, index) => { youFunc(row, index , 'params')}" ></Table>
</template>
<script>
export default {
methods:{
youFunc(row, index, params) {
console.log(row, index, params)
}
},
data () {
return {
columns6: [
{
title: 'Date' ,
key: 'date'
},
{
title: 'Name' ,
key: 'name'
},
{
title: 'Age' ,
key: 'age' ,
filters: [
{
label: 'Greater than 25' ,
value: 1
},
{
label: 'Less than 25' ,
value: 2
}
],
filterMultiple: false,
filterMethod (value, row) {
if (value === 1) {
return row.age > 25;
} else if (value === 2) {
return row.age < 25;
}
}
},
{
title: 'Address' ,
key: 'address' ,
filters: [
{
label: 'New York' ,
value: 'New York'
},
{
label: 'London' ,
value: 'London'
},
{
label: 'Sydney' ,
value: 'Sydney'
}
],
filterMethod (value, row) {
return row.address.indexOf(value) > -1;
}
}
],
data5: [
{
name: 'John Brown' ,
age: 18,
address: 'New York No. 1 Lake Park' ,
date : '2016-10-03'
},
{
name: 'Jim Green' ,
age: 24,
address: 'London No. 1 Lake Park' ,
date : '2016-10-01'
},
{
name: 'Joe Black' ,
age: 30,
address: 'Sydney No. 1 Lake Park' ,
date : '2016-10-02'
},
{
name: 'Jon Snow' ,
age: 26,
address: 'Ottawa No. 2 Lake Park' ,
date : '2016-10-04'
}
],
}
}
}
</script>
|