Map

The reactive versions of Map & WeakMap built-in data structures.

• ReactiveMap - A reactive Map.
• ReactiveWeakMap - A reactive WeakMap.

#ReactiveMap and ReactiveWeakMap

A reactive version of Map/WeakMap data structure. All the reads (e.g. get or has) are signals, and all the writes (e.g. delete or set) will cause updates to appropriate signals.

#How to use it

#Import

import { ReactiveMap } from "@solid-primitives/map";
// or
import { ReactiveWeakMap } from "@solid-primitives/map";

#Basic usage

The usage is almost the same as the original Javascript structures.

const userPoints = new ReactiveMap<User, number>();
// reads can be listened to reactively
createEffect(() => {
  userPoints.get(user1); // => T: number | undefined (reactive)
  userPoints.has(user1); // => T: boolean (reactive)
  // ReactiveWeakMap won't have .size or any methods that loop over the values
  userPoints.size; // => T: number (reactive)
});
// apply changes
userPoints.set(user1, 100);
userPoints.delete(user2);
userPoints.set(user1, { foo: "bar" });

#Constructor arguments

ReactiveMap's and ReactiveWeakMap's constructor one optional argument that is the initial entries of the map.

const map = new ReactiveMap([
  ["foo", [1, 2, 3]],
  ["bar", [3, 4, 5]],
]);

#Values are shallowly wrapped

Treat the values of ReactiveMap and ReactiveMap as individual signals, to cause updates, they have to be set through the .set() method, no mutations.

const map = new ReactiveMap<string, { age: number }>();
map.set("John", { age: 34 });

// this won't cause any updates:
map.get("John").age = 35;

// this will:
map.set("John", { age: 35 });

#Changelog

See CHANGELOG.md