docs(input, textarea): clarify ionInput and ionChange (#27710)

Issue number: N/A

---------

<!-- 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. -->

See https://github.com/ionic-team/ionic-framework/issues/27709

The `ionInput` description is vague and does not clarify that it only
fires as the user types.

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

- Clarified the ionInput description for input and textarea

## 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. -->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
This commit is contained in:
Liam DeBeasi
2023-06-28 11:26:37 -04:00
committed by GitHub
parent 2af5a141dc
commit 458d16e742
4 changed files with 28 additions and 30 deletions

View File

@ -284,8 +284,9 @@ export class Input implements ComponentInterface {
@Prop({ mutable: true }) value?: string | number | null = '';
/**
* The `ionInput` event fires when the `value` of an `<ion-input>` element
* has been changed.
* The `ionInput` event is fired each time the user modifies the input's value.
* Unlike the `ionChange` event, the `ionInput` event is fired for each alteration
* to the input's value. This typically happens for each keystroke as the user types.
*
* For elements that accept text input (`type=text`, `type=tel`, etc.), the interface
* is [`InputEvent`](https://developer.mozilla.org/en-US/docs/Web/API/InputEvent); for others,
@ -295,9 +296,9 @@ export class Input implements ComponentInterface {
@Event() ionInput!: EventEmitter<InputInputEventDetail>;
/**
* The `ionChange` event is fired for `<ion-input>` elements when the user
* modifies the element's value. Unlike the `ionInput` event, the `ionChange`
* event is not necessarily fired for each alteration to an element's value.
* The `ionChange` event is fired when the user modifies the input's value.
* Unlike the `ionInput` event, the `ionChange` event is only fired when changes
* are committed, not as the user types.
*
* Depending on the way the users interacts with the element, the `ionChange`
* event fires at a different moment: