Replies: 1 comment
-
Lit does not observe deep values or array mutations for performance reasons. You should look to spread these objects into their own components and look into using for a more-direct migration: splicesFor a single use case or generic. For the generic use case you'd likely need to make your own version of Polymer's export interface Splice<T=unknown> {index: number, removed: T[], addedCount: number, object: T[], type: 'splice'};
export type SpliceCallback<T = unknown> = (splices: Splice<T>[], path: string) => void;
export const arraySplice = async <T=unknown>(host: LitElement, path:string, array: T[], index: number, removeCount: number, callback: SpliceCallback<T>, ...added: T[]) => {
const removed = array.splice(index, removeCount, ...added);
callback([{removed, index, addedCount: added.length, object: array, type: 'splice'}], path);
host.requestUpdate(path);
}
// usage
import {arraySplice} from './legacy-polymer-array-splice';
arraySplice(this, 'myArray', this.myArray, 1, 1, this._handleLabelRemoved, item1, item2, item3) For the single use case, you can just do this wherever you call Polymer's // before
this.splice('myArray', 1, 1, item1, item2, item3);
// after
const removed = this.myArray.splice(1, 1, item1, item2, item3);
this._handleLabelRemoved([{removed}], 'myArray');
this.requestUpdate('myArray'); deep property changeYou're going to need to look into using proxies. Something like this: |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Hi, does anyone know how to migrate:
to lit?
Beta Was this translation helpful? Give feedback.
All reactions