kopia lustrzana https://github.com/shoelace-style/shoelace
run watch decorator after update completes
rodzic
2fbd2af914
commit
5fd4bca95d
|
@ -11,6 +11,7 @@ _During the beta period, these restrictions may be relaxed in the event of a mis
|
|||
- Fixed a bug in `sl-animation` where `sl-cancel` and `sl-finish` events would never fire
|
||||
- Fixed a bug where `sl-alert` wouldn't always transition properly
|
||||
- Fixed a bug where using `sl-menu` inside a shadow root would break keyboard selections [#382](https://github.com/shoelace-style/shoelace/issues/382)
|
||||
- Improved `@watch` decorator to run after update instead of during
|
||||
- Updated `sl-menu-item` checked icon to `check` instead of `check2`
|
||||
|
||||
## 2.0.0-beta.34
|
||||
|
|
|
@ -257,8 +257,7 @@ export default class SlInput extends LitElement {
|
|||
|
||||
@watch('value')
|
||||
handleValueChange() {
|
||||
// Wait for the update to complete before checking the input's validity
|
||||
this.updateComplete.then(() => (this.invalid = !this.input.checkValidity()));
|
||||
this.invalid = !this.input.checkValidity();
|
||||
}
|
||||
|
||||
render() {
|
||||
|
|
|
@ -238,8 +238,7 @@ export default class SlTextarea extends LitElement {
|
|||
|
||||
@watch('value')
|
||||
handleValueChange() {
|
||||
// Wait for the update to complete before checking the input's validity
|
||||
this.updateComplete.then(() => (this.invalid = !this.input.checkValidity()));
|
||||
this.invalid = !this.input.checkValidity();
|
||||
}
|
||||
|
||||
setTextareaHeight() {
|
||||
|
|
|
@ -63,8 +63,11 @@ export class EventEmitter<T> {
|
|||
|
||||
// @watch decorator
|
||||
//
|
||||
// Runs when an observed property changes, e.g. @property or @internalProperty. This will only run after the first
|
||||
// update, so initial values will not trigger the watch function.
|
||||
// Runs after an observed property changes, e.g. @property or @internalProperty. This will only run after the first
|
||||
// update, so initial attribute => property mappings will not trigger the watch handler.
|
||||
//
|
||||
// Note that changing props in a watch handler *will* trigger a rerender. To make pre-update changes to observed
|
||||
// properties, use the `update()` method instead.
|
||||
//
|
||||
// Usage:
|
||||
//
|
||||
|
@ -74,15 +77,10 @@ export class EventEmitter<T> {
|
|||
//
|
||||
export function watch(propName: string) {
|
||||
return (protoOrDescriptor: any, name: string): any => {
|
||||
const { firstUpdated, update } = protoOrDescriptor;
|
||||
const { updated } = protoOrDescriptor;
|
||||
|
||||
protoOrDescriptor.firstUpdated = function (changedProps: Map<string, any>) {
|
||||
firstUpdated.call(this, changedProps);
|
||||
this.__didFirstUpdate = true;
|
||||
};
|
||||
|
||||
protoOrDescriptor.update = function (changedProps: Map<string, any>) {
|
||||
if (this.__didFirstUpdate && changedProps.has(propName)) {
|
||||
protoOrDescriptor.updated = function (changedProps: Map<string, any>) {
|
||||
if (this.__hasBeenUpdated && changedProps.has(propName)) {
|
||||
const oldValue = changedProps.get(propName);
|
||||
const newValue = this[propName];
|
||||
|
||||
|
@ -91,7 +89,8 @@ export function watch(propName: string) {
|
|||
}
|
||||
}
|
||||
|
||||
update.call(this, changedProps);
|
||||
updated.call(this, changedProps);
|
||||
this.__hasBeenUpdated = true;
|
||||
};
|
||||
};
|
||||
}
|
||||
|
|
Ładowanie…
Reference in New Issue