File tree Expand file tree Collapse file tree 2 files changed +2
-35
lines changed Expand file tree Collapse file tree 2 files changed +2
-35
lines changed Original file line number Diff line number Diff line change 82
82
</template >
83
83
84
84
<script >
85
- import elementResizeDetectorMaker from ' element-resize-detector'
86
85
import CLink from ' ../Link/CLink'
87
86
88
87
export default {
140
139
lastButtonHtml: {
141
140
type: String ,
142
141
default: ' »'
143
- },
144
- responsive: [Boolean , Object ]
145
- },
146
- data () {
147
- return {
148
- minifiedSize: null ,
149
- erd: elementResizeDetectorMaker ()
150
142
}
151
143
},
152
144
watch: {
159
151
}
160
152
}
161
153
},
162
- mounted () {
163
- if (this .responsive ) {
164
- this .erd .listenTo (this .$el , this .onWrapperResize )
165
- }
166
- },
167
154
computed: {
168
- dims () {
169
- return this .size === ' sm' ? ' sm' : this .minifiedSize || this .size
170
- },
171
155
backArrowsClasses () {
172
156
return [' page-item' , { ' disabled' : this .activePage === 1 }]
173
157
},
174
158
nextArrowsClasses () {
175
159
return [' page-item' , { ' disabled' : this .activePage === this .pages }]
176
160
},
177
161
computedClasses () {
178
- return ` pagination pagination-${ this .dims } justify-content-${ this .align } `
162
+ return ` pagination pagination-${ this .size } justify-content-${ this .align } `
179
163
},
180
164
showDots () {
181
165
return this .dots && this .limit > 4 && this .limit < this .pages
215
199
}
216
200
},
217
201
methods: {
218
- onWrapperResize (el ) {
219
- const md = this .responsive .md || 600
220
- const sm = this .responsive .sm || 400
221
- const wrapper = el .clientWidth
222
- this .minifiedSize = wrapper > md ? null : wrapper > sm ? ' md' : ' sm'
223
- },
224
202
setPage (number ) {
225
203
if (number !== this .activePage ) {
226
204
this .$emit (' update:activePage' , number)
Original file line number Diff line number Diff line change @@ -12,8 +12,7 @@ const customWrapper = mount(Component, {
12
12
limit : 7 ,
13
13
dots : false ,
14
14
arrows : false ,
15
- doubleArrows : false ,
16
- responsive : true
15
+ doubleArrows : false
17
16
}
18
17
} )
19
18
@@ -39,14 +38,4 @@ describe(ComponentName, () => {
39
38
links . at ( 4 ) . trigger ( 'click' )
40
39
expect ( defaultWrapper . emitted ( ) [ 'update:activePage' ] ) . toBeTruthy ( )
41
40
} )
42
- it ( 'correctly change size on wrapper resize when responsive' , ( ) => {
43
- customWrapper . vm . onWrapperResize ( { clientWidth : 700 } )
44
- expect ( customWrapper . vm . dims ) . toBe ( 'lg' )
45
-
46
- customWrapper . vm . onWrapperResize ( { clientWidth : 500 } )
47
- expect ( customWrapper . vm . dims ) . toBe ( 'md' )
48
-
49
- customWrapper . vm . onWrapperResize ( { clientWidth : 300 } )
50
- expect ( customWrapper . vm . dims ) . toBe ( 'sm' )
51
- } )
52
41
} )
You can’t perform that action at this time.
0 commit comments