File tree Expand file tree Collapse file tree 1 file changed +23
-3
lines changed
src/components/form-spinbutton Expand file tree Collapse file tree 1 file changed +23
-3
lines changed Original file line number Diff line number Diff line change 26
26
}
27
27
</script >
28
28
29
- <!-- b-spin-botton -demo.vue -->
29
+ <!-- b-form-spinbotton -demo.vue -->
30
30
```
31
31
32
32
## Overview
@@ -53,6 +53,26 @@ values allowed).
53
53
54
54
When ` step ` is set, the value will always be a multiple of the step size plus the minimum value.
55
55
56
+ ## Number wrapping
57
+
58
+ By default, when the value is increased to the ` max ` value, it pressing the increment button will
59
+ have no effect. Similarily when the value is as the ` min ` value, pressing the decrement button
60
+ will ahve no effect.
61
+
62
+ To allow the spin button to wrap from max to min when incrementing (or min to max when decremening),
63
+ set the ` wrap ` prop to ` true ` .
64
+
65
+ ``` html
66
+ <template >
67
+ <div >
68
+ <label for =" sb-wrap" >Wrapping value spin button</label >
69
+ <b-form-spinbutton id =" sb-wrap" wrap min =" 1" max =" 25" ></b-form-spinbutton >
70
+ </div >
71
+ </template >
72
+
73
+ <!-- b-form-spinbotton-wrap.vue -->
74
+ ```
75
+
56
76
## Styling
57
77
58
78
### Size
@@ -74,7 +94,7 @@ As with other form controls, `<b-form-spinbutton>` supports small and large sizi
74
94
</div >
75
95
</template >
76
96
77
- <!-- b-spin-botton -size.vue -->
97
+ <!-- b-form-spinbotton -size.vue -->
78
98
```
79
99
80
100
### Inline
@@ -93,7 +113,7 @@ Spinbuttons can be oriented in vertical mode:
93
113
</div >
94
114
</template >
95
115
96
- <!-- b-spin-botton -vertical.vue -->
116
+ <!-- b-form-spinbotton -vertical.vue -->
97
117
```
98
118
99
119
Vertical spinbuttons can also be sized.
You can’t perform that action at this time.
0 commit comments