Blame view

test/routers/table.vue 3.35 KB
2cb8a6d9   梁灏   commit Table comp...
1
  <template>
50637863   梁灏   update DatePicker
2
3
      <i-button @click="changeFilter">改变filter</i-button>
      <i-table border :columns="columns6" :data="data5"></i-table>
2cb8a6d9   梁灏   commit Table comp...
4
5
6
  </template>
  <script>
      export default {
2cb8a6d9   梁灏   commit Table comp...
7
8
          data () {
              return {
50637863   梁灏   update DatePicker
9
10
11
12
13
                  columns6: [
                      {
                          title: '日期',
                          key: 'date'
                      },
84a351df   梁灏   Layout support re...
14
                      {
db8d1f7d   梁灏   fixed #121
15
                          title: '姓名',
50637863   梁灏   update DatePicker
16
                          key: 'name'
84a351df   梁灏   Layout support re...
17
18
                      },
                      {
db8d1f7d   梁灏   fixed #121
19
20
                          title: '年龄',
                          key: 'age',
50637863   梁灏   update DatePicker
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
                          filters: [
                              {
                                  label: '大于25岁',
                                  value: 1
                              },
                              {
                                  label: '小于25岁',
                                  value: 2
                              }
                          ],
                          filterMultiple: false,
                          filterMethod (value, row) {
                              if (value === 1) {
                                  return row.age > 25;
                              } else if (value === 2) {
                                  return row.age < 25;
                              }
                          }
84a351df   梁灏   Layout support re...
39
40
                      },
                      {
db8d1f7d   梁灏   fixed #121
41
42
                          title: '地址',
                          key: 'address',
50637863   梁灏   update DatePicker
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
                          filters: [
                              {
                                  label: '北京',
                                  value: '北京'
                              },
                              {
                                  label: '上海',
                                  value: '上海'
                              },
                              {
                                  label: '深圳',
                                  value: '深圳'
                              }
                          ],
                          filterMethod (value, row) {
                              return row.address.indexOf(value) > -1;
db8d1f7d   梁灏   fixed #121
59
                          }
84a351df   梁灏   Layout support re...
60
61
                      }
                  ],
50637863   梁灏   update DatePicker
62
                  data5: [
db8d1f7d   梁灏   fixed #121
63
64
65
66
                      {
                          name: '王小明',
                          age: 18,
                          address: '北京市朝阳区芍药居',
50637863   梁灏   update DatePicker
67
                          date: '2016-10-03'
db8d1f7d   梁灏   fixed #121
68
69
70
71
72
                      },
                      {
                          name: '张小刚',
                          age: 25,
                          address: '北京市海淀区西二旗',
50637863   梁灏   update DatePicker
73
                          date: '2016-10-01'
db8d1f7d   梁灏   fixed #121
74
75
76
77
78
                      },
                      {
                          name: '李小红',
                          age: 30,
                          address: '上海市浦东新区世纪大道',
50637863   梁灏   update DatePicker
79
                          date: '2016-10-02'
db8d1f7d   梁灏   fixed #121
80
81
82
83
84
                      },
                      {
                          name: '周小伟',
                          age: 26,
                          address: '深圳市南山区深南大道',
50637863   梁灏   update DatePicker
85
86
87
88
89
90
91
92
93
94
95
                          date: '2016-10-04'
                      }
                  ]
              }
          },
          methods: {
              changeFilter () {
                  this.columns6[2].filters = [
                      {
                          label: '小于25岁',
                          value: 2
2cb8a6d9   梁灏   commit Table comp...
96
                      }
84a351df   梁灏   Layout support re...
97
                  ]
2cb8a6d9   梁灏   commit Table comp...
98
              }
2cb8a6d9   梁灏   commit Table comp...
99
100
          }
      }
d0e206c5   梁灏   Table add content...
101
  </script>