(value: SegmentValue | undefined, oldValue?: SegmentValue | undefined)
| 90 | |
| 91 | @Watch('value') |
| 92 | protected valueChanged(value: SegmentValue | undefined, oldValue?: SegmentValue | undefined) { |
| 93 | // Force a value to exist if we're using a segment view |
| 94 | if (this.segmentViewEl && value === undefined) { |
| 95 | this.value = this.getButtons()[0].value; |
| 96 | return; |
| 97 | } |
| 98 | |
| 99 | if (oldValue !== undefined && value !== undefined) { |
| 100 | const buttons = this.getButtons(); |
| 101 | const previous = buttons.find((button) => button.value === oldValue); |
| 102 | const current = buttons.find((button) => button.value === value); |
| 103 | |
| 104 | if (previous && current) { |
| 105 | if (!this.segmentViewEl) { |
| 106 | this.checkButton(previous, current); |
| 107 | } else if (this.triggerScrollOnValueChange !== false) { |
| 108 | this.updateSegmentView(); |
| 109 | } |
| 110 | } |
| 111 | } else if (value !== undefined && oldValue === undefined && this.segmentViewEl) { |
| 112 | this.updateSegmentView(); |
| 113 | } |
| 114 | |
| 115 | /** |
| 116 | * `ionSelect` is emitted every time the value changes (internal or external changes). |
| 117 | * Used by `ion-segment-button` to determine if the button should be checked. |
| 118 | */ |
| 119 | this.ionSelect.emit({ value }); |
| 120 | |
| 121 | // The scroll listener should handle scrolling the active button into view as needed |
| 122 | if (!this.segmentViewEl) { |
| 123 | this.scrollActiveButtonIntoView(); |
| 124 | } |
| 125 | |
| 126 | this.triggerScrollOnValueChange = undefined; |
| 127 | } |
| 128 | |
| 129 | /** |
| 130 | * If `true`, navigating to an `ion-segment-button` with the keyboard will focus and select the element. |
no test coverage detected