Commit c2d74eca9ab1aac2a8e1aec05aa6ea28ab98c28c
1 parent
b92a1b5c
fixed #2100
Showing
2 changed files
with
47 additions
and
18 deletions
Show diff stats
examples/routers/tabs.vue
| @@ -94,39 +94,65 @@ | @@ -94,39 +94,65 @@ | ||
| 94 | } | 94 | } |
| 95 | </script> --> | 95 | </script> --> |
| 96 | 96 | ||
| 97 | +<!--<template>--> | ||
| 98 | + <!--<div>--> | ||
| 99 | + <!--<Button type="ghost" @click="toFirst" size="small">to first</Button>--> | ||
| 100 | + <!--<Button type="ghost" @click="toLast" size="small">to last</Button>--> | ||
| 101 | + <!--<Tabs type="card" :animated="animated" v-model="activeTab">--> | ||
| 102 | + <!--<TabPane v-for="tab in tabs" :key="tab" :label="'标签' + tab" :name="tab+''" closable>标签{{ tab }}</TabPane>--> | ||
| 103 | + <!--<div slot="extra">--> | ||
| 104 | + <!--<Button type="ghost" @click="handleTabsAdd" size="small">增加</Button>--> | ||
| 105 | + <!--</div>--> | ||
| 106 | + <!--</Tabs>--> | ||
| 107 | + <!--</div>--> | ||
| 108 | +<!--</template>--> | ||
| 109 | +<!--<script>--> | ||
| 110 | + <!--export default {--> | ||
| 111 | + <!--data () {--> | ||
| 112 | + <!--return {--> | ||
| 113 | + <!--tabs: 2,--> | ||
| 114 | + <!--activeTab:"2",--> | ||
| 115 | + <!--animated:true--> | ||
| 116 | + <!--}--> | ||
| 117 | + <!--},--> | ||
| 118 | + <!--methods: {--> | ||
| 119 | + <!--handleTabsAdd () {--> | ||
| 120 | + <!--this.tabs ++;--> | ||
| 121 | + <!--this.activeTab = this.tabs + '';--> | ||
| 122 | + <!--},--> | ||
| 123 | + <!--toFirst () {--> | ||
| 124 | + <!--this.activeTab = '1';--> | ||
| 125 | + <!--},--> | ||
| 126 | + <!--toLast () {--> | ||
| 127 | + <!--this.activeTab = this.tabs+'';--> | ||
| 128 | + <!--}--> | ||
| 129 | + <!--}--> | ||
| 130 | + <!--}--> | ||
| 131 | +<!--</script>--> | ||
| 132 | + | ||
| 97 | <template> | 133 | <template> |
| 98 | <div> | 134 | <div> |
| 99 | - <Button type="ghost" @click="toFirst" size="small">to first</Button> | ||
| 100 | - <Button type="ghost" @click="toLast" size="small">to last</Button> | ||
| 101 | - <Tabs type="card" :animated="animated" v-model="activeTab"> | ||
| 102 | - <TabPane v-for="tab in tabs" :key="tab" :label="'标签' + tab" :name="tab+''" closable>标签{{ tab }}</TabPane> | ||
| 103 | - <div slot="extra"> | ||
| 104 | - <Button type="ghost" @click="handleTabsAdd" size="small">增加</Button> | ||
| 105 | - </div> | ||
| 106 | - </Tabs> | 135 | + <Tabs type="card"> |
| 136 | + <TabPane v-for="tab in tabs" :key="tab" :label="'标签' + tab">标签{{ tab }}</TabPane> | ||
| 137 | + </Tabs> | ||
| 138 | + <Button type="ghost" @click="handleTabsAdd" size="small">增加</Button> | ||
| 139 | + <Button type="ghost" @click="handleTabsMin" size="small">减少</Button> | ||
| 107 | </div> | 140 | </div> |
| 108 | </template> | 141 | </template> |
| 109 | <script> | 142 | <script> |
| 110 | export default { | 143 | export default { |
| 111 | data () { | 144 | data () { |
| 112 | return { | 145 | return { |
| 113 | - tabs: 2, | ||
| 114 | - activeTab:"2", | ||
| 115 | - animated:true | 146 | + tabs: 2 |
| 116 | } | 147 | } |
| 117 | }, | 148 | }, |
| 118 | methods: { | 149 | methods: { |
| 119 | handleTabsAdd () { | 150 | handleTabsAdd () { |
| 120 | this.tabs ++; | 151 | this.tabs ++; |
| 121 | - this.activeTab = this.tabs + ''; | ||
| 122 | }, | 152 | }, |
| 123 | - toFirst () { | ||
| 124 | - this.activeTab = '1'; | ||
| 125 | - }, | ||
| 126 | - toLast () { | ||
| 127 | - this.activeTab = this.tabs+''; | 153 | + handleTabsMin () { |
| 154 | + this.tabs --; | ||
| 128 | } | 155 | } |
| 129 | } | 156 | } |
| 130 | } | 157 | } |
| 131 | </script> | 158 | </script> |
| 132 | - |