mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-11-14 05:28:57 +08:00
refactor(checkbox, radio-group, select, toggle): update variable
This commit is contained in:
@@ -127,7 +127,7 @@ export class Checkbox implements ComponentInterface {
|
|||||||
*/
|
*/
|
||||||
@State() isInvalid = false;
|
@State() isInvalid = false;
|
||||||
|
|
||||||
@State() private hintTextID?: string;
|
@State() private hintTextId?: string;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Emitted when the checked property has changed as a result of a user action such as a click.
|
* Emitted when the checked property has changed as a result of a user action such as a click.
|
||||||
@@ -174,7 +174,7 @@ export class Checkbox implements ComponentInterface {
|
|||||||
* a higher priority.
|
* a higher priority.
|
||||||
*/
|
*/
|
||||||
Promise.resolve().then(() => {
|
Promise.resolve().then(() => {
|
||||||
this.hintTextID = this.getHintTextID();
|
this.hintTextId = this.getHintTextId();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@@ -194,7 +194,7 @@ export class Checkbox implements ComponentInterface {
|
|||||||
...inheritAriaAttributes(this.el),
|
...inheritAriaAttributes(this.el),
|
||||||
};
|
};
|
||||||
|
|
||||||
this.hintTextID = this.getHintTextID();
|
this.hintTextId = this.getHintTextId();
|
||||||
}
|
}
|
||||||
|
|
||||||
disconnectedCallback() {
|
disconnectedCallback() {
|
||||||
@@ -265,7 +265,7 @@ export class Checkbox implements ComponentInterface {
|
|||||||
ev.stopPropagation();
|
ev.stopPropagation();
|
||||||
};
|
};
|
||||||
|
|
||||||
private getHintTextID(): string | undefined {
|
private getHintTextId(): string | undefined {
|
||||||
const { helperText, errorText, helperTextId, errorTextId, isInvalid } = this;
|
const { helperText, errorText, helperTextId, errorTextId, isInvalid } = this;
|
||||||
|
|
||||||
if (isInvalid && errorText) {
|
if (isInvalid && errorText) {
|
||||||
@@ -336,7 +336,7 @@ export class Checkbox implements ComponentInterface {
|
|||||||
<Host
|
<Host
|
||||||
role="checkbox"
|
role="checkbox"
|
||||||
aria-checked={indeterminate ? 'mixed' : `${checked}`}
|
aria-checked={indeterminate ? 'mixed' : `${checked}`}
|
||||||
aria-describedby={this.hintTextID}
|
aria-describedby={this.hintTextId}
|
||||||
aria-invalid={this.isInvalid ? 'true' : undefined}
|
aria-invalid={this.isInvalid ? 'true' : undefined}
|
||||||
aria-labelledby={hasLabelContent ? this.inputLabelId : null}
|
aria-labelledby={hasLabelContent ? this.inputLabelId : null}
|
||||||
aria-label={inheritedAttributes['aria-label'] || null}
|
aria-label={inheritedAttributes['aria-label'] || null}
|
||||||
|
|||||||
@@ -29,7 +29,7 @@ export class RadioGroup implements ComponentInterface {
|
|||||||
*/
|
*/
|
||||||
@State() isInvalid = false;
|
@State() isInvalid = false;
|
||||||
|
|
||||||
@State() private hintTextID?: string;
|
@State() private hintTextId?: string;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* If `true`, the radios can be deselected.
|
* If `true`, the radios can be deselected.
|
||||||
@@ -156,7 +156,7 @@ export class RadioGroup implements ComponentInterface {
|
|||||||
* a higher priority.
|
* a higher priority.
|
||||||
*/
|
*/
|
||||||
Promise.resolve().then(() => {
|
Promise.resolve().then(() => {
|
||||||
this.hintTextID = this.getHintTextID();
|
this.hintTextId = this.getHintTextId();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@@ -172,7 +172,7 @@ export class RadioGroup implements ComponentInterface {
|
|||||||
}
|
}
|
||||||
|
|
||||||
componentWillLoad() {
|
componentWillLoad() {
|
||||||
this.hintTextID = this.getHintTextID();
|
this.hintTextId = this.getHintTextId();
|
||||||
}
|
}
|
||||||
|
|
||||||
disconnectedCallback() {
|
disconnectedCallback() {
|
||||||
@@ -323,7 +323,7 @@ export class RadioGroup implements ComponentInterface {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
private getHintTextID(): string | undefined {
|
private getHintTextId(): string | undefined {
|
||||||
const { helperText, errorText, helperTextId, errorTextId, isInvalid } = this;
|
const { helperText, errorText, helperTextId, errorTextId, isInvalid } = this;
|
||||||
|
|
||||||
if (isInvalid && errorText) {
|
if (isInvalid && errorText) {
|
||||||
@@ -347,7 +347,7 @@ export class RadioGroup implements ComponentInterface {
|
|||||||
<Host
|
<Host
|
||||||
role="radiogroup"
|
role="radiogroup"
|
||||||
aria-labelledby={label ? labelId : null}
|
aria-labelledby={label ? labelId : null}
|
||||||
aria-describedby={this.hintTextID}
|
aria-describedby={this.hintTextId}
|
||||||
aria-invalid={this.isInvalid ? 'true' : undefined}
|
aria-invalid={this.isInvalid ? 'true' : undefined}
|
||||||
onClick={this.onClick}
|
onClick={this.onClick}
|
||||||
class={mode}
|
class={mode}
|
||||||
|
|||||||
@@ -87,7 +87,7 @@ export class Select implements ComponentInterface {
|
|||||||
*/
|
*/
|
||||||
@State() isInvalid = false;
|
@State() isInvalid = false;
|
||||||
|
|
||||||
@State() private hintTextID?: string;
|
@State() private?: string;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* The text to display on the cancel button.
|
* The text to display on the cancel button.
|
||||||
@@ -332,7 +332,7 @@ export class Select implements ComponentInterface {
|
|||||||
* a higher priority.
|
* a higher priority.
|
||||||
*/
|
*/
|
||||||
Promise.resolve().then(() => {
|
Promise.resolve().then(() => {
|
||||||
this.hintTextID = this.getHintTextID();
|
this.hintTextId = this.getHintTextId();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@@ -350,7 +350,7 @@ export class Select implements ComponentInterface {
|
|||||||
componentWillLoad() {
|
componentWillLoad() {
|
||||||
this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);
|
this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);
|
||||||
|
|
||||||
this.hintTextID = this.getHintTextID();
|
this.hintTextId = this.getHintTextId();
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidLoad() {
|
componentDidLoad() {
|
||||||
@@ -1111,7 +1111,7 @@ export class Select implements ComponentInterface {
|
|||||||
aria-label={this.ariaLabel}
|
aria-label={this.ariaLabel}
|
||||||
aria-haspopup="dialog"
|
aria-haspopup="dialog"
|
||||||
aria-expanded={`${isExpanded}`}
|
aria-expanded={`${isExpanded}`}
|
||||||
aria-describedby={this.hintTextID}
|
aria-describedby={this.hintTextId}
|
||||||
aria-invalid={this.isInvalid ? 'true' : undefined}
|
aria-invalid={this.isInvalid ? 'true' : undefined}
|
||||||
aria-required={`${required}`}
|
aria-required={`${required}`}
|
||||||
onFocus={this.onFocus}
|
onFocus={this.onFocus}
|
||||||
@@ -1121,7 +1121,7 @@ export class Select implements ComponentInterface {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
private getHintTextID(): string | undefined {
|
private getHintTextId(): string | undefined {
|
||||||
const { helperText, errorText, helperTextId, errorTextId, isInvalid } = this;
|
const { helperText, errorText, helperTextId, errorTextId, isInvalid } = this;
|
||||||
|
|
||||||
if (isInvalid && errorText) {
|
if (isInvalid && errorText) {
|
||||||
|
|||||||
@@ -56,7 +56,7 @@ export class Toggle implements ComponentInterface {
|
|||||||
*/
|
*/
|
||||||
@State() isInvalid = false;
|
@State() isInvalid = false;
|
||||||
|
|
||||||
@State() private hintTextID?: string;
|
@State() private hintTextId?: string;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* The color to use from your application's color palette.
|
* The color to use from your application's color palette.
|
||||||
@@ -214,7 +214,7 @@ export class Toggle implements ComponentInterface {
|
|||||||
* a higher priority.
|
* a higher priority.
|
||||||
*/
|
*/
|
||||||
Promise.resolve().then(() => {
|
Promise.resolve().then(() => {
|
||||||
this.hintTextID = this.getHintTextID();
|
this.hintTextId = this.getHintTextId();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@@ -270,7 +270,7 @@ export class Toggle implements ComponentInterface {
|
|||||||
...inheritAriaAttributes(this.el),
|
...inheritAriaAttributes(this.el),
|
||||||
};
|
};
|
||||||
|
|
||||||
this.hintTextID = this.getHintTextID();
|
this.hintTextId = this.getHintTextId();
|
||||||
}
|
}
|
||||||
|
|
||||||
private onStart() {
|
private onStart() {
|
||||||
@@ -393,7 +393,7 @@ export class Toggle implements ComponentInterface {
|
|||||||
return this.el.textContent !== '';
|
return this.el.textContent !== '';
|
||||||
}
|
}
|
||||||
|
|
||||||
private getHintTextID(): string | undefined {
|
private getHintTextId(): string | undefined {
|
||||||
const { helperText, errorText, helperTextId, errorTextId, isInvalid } = this;
|
const { helperText, errorText, helperTextId, errorTextId, isInvalid } = this;
|
||||||
|
|
||||||
if (isInvalid && errorText) {
|
if (isInvalid && errorText) {
|
||||||
@@ -462,7 +462,7 @@ export class Toggle implements ComponentInterface {
|
|||||||
<Host
|
<Host
|
||||||
role="switch"
|
role="switch"
|
||||||
aria-checked={`${checked}`}
|
aria-checked={`${checked}`}
|
||||||
aria-describedby={this.hintTextID}
|
aria-describedby={this.hintTextId}
|
||||||
aria-invalid={this.isInvalid ? 'true' : undefined}
|
aria-invalid={this.isInvalid ? 'true' : undefined}
|
||||||
onClick={this.onClick}
|
onClick={this.onClick}
|
||||||
aria-labelledby={hasLabel ? inputLabelId : null}
|
aria-labelledby={hasLabel ? inputLabelId : null}
|
||||||
|
|||||||
Reference in New Issue
Block a user