javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-09 16:16:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(segment): segment disables segment buttons created asyncronously (#27155)

Browse Source 
<!-- Please refer to our contributing documentation for any questions on
submitting a pull request, or let us know here if you need any help:
https://ionicframework.com/docs/building/contributing -->

<!-- Some docs updates need to be made in the `ionic-docs` repo, in a
separate PR. See
https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#modifying-documentation
for details. -->

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->

Segment buttons are only disabled when the segment's `disabled` property
changes. This means that segment buttons added to the segment async
don't have their `disabled` state inited correctly.

<!-- Issues are required for both bug fixes and features. -->
Issue URL: Resolves
https://github.com/ionic-team/ionic-framework/issues/25396


## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

Segment buttons now check if their parent segment is `disabled` when
added to the DOM.

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->

---------

Co-authored-by: ionitron <hi@ionicframework.com>
This commit is contained in:
Amanda Johnston
2023-04-11 14:00:23 -05:00
committed by GitHub
parent 60a2a62ad0
commit ad6b1301cf
2 changed files with 27 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
core/src/components/segment-button/segment-button.tsx
View File

@ -38,7 +38,7 @@ export class SegmentButton implements ComponentInterface, ButtonInterface {
/**
* If `true`, the user cannot interact with the segment button.
*/
@Prop() disabled = false;
@Prop({ mutable: true }) disabled = false;
/**
* Set the layout of the text and icon in the segment.
@ -92,8 +92,14 @@ export class SegmentButton implements ComponentInterface, ButtonInterface {
};
private updateState = () => {
if (this.segmentEl) {
this.checked = this.segmentEl.value === this.value;
const { segmentEl } = this;
if (segmentEl) {
this.checked = segmentEl.value === this.value;
if (segmentEl.disabled) {
this.disabled = true;
}
}
};