Reactive Dict

A ReactiveDict stores an arbitrary set of key-value pairs. Use it to manage internal state in your components, ie. like the currently selected item in a list. Each key is individully reactive such that calling set for a key will invalidate any Computations that called get with that key, according to the usual contract for reactive data sources.

That means if you call ReactiveDict#get('currentList') from inside a Blaze template helper, the template will automatically be rerendered whenever ReactiveDict#set('currentList', x) is called.

To use ReactiveDict, add the reactive-dict package to your project by running in your terminal:

meteor add reactive-dict

ReactiveDict

Client only

Summary:

Constructor for a ReactiveDict, which represents a reactive dictionary of key/value pairs.

Arguments:

Source code

Name	Type	Description	Required
name	String	Optional. When a name is passed, preserves contents across Hot Code Pushes	No
initialValue	Object	Optional. The default values for the dictionary	No

import { ReactiveDict } from "meteor/reactive-dict";  const reactiveDict = new ReactiveDict();  "name", // this param is optional 
 initialValue, // this param is optional  ); 

If you provide a name to its constructor, its contents will be saved across Hot Code Push client code updates.

reactiveDict.set

Client only

Summary:

Set a value for a key in the ReactiveDict. Notify any listeners that the value has changed (eg: redraw templates, and rerun any Tracker.autorun computations, that called ReactiveDict.get on this key.)

Arguments:

Source code

Name	Type	Description	Required
key	String	The key to set, eg, selectedItem	Yes
value	EJSONable or undefined	The new value for key	Yes

Example:

import { ReactiveDict } from "meteor/reactive-dict"; import { Tracker } from "meteor/tracker"; import { Meteor } from "meteor/meteor";  const state = new ReactiveDict(); state.set("currentRoomId", "random");  Tracker.autorun(() => {  Meteor.subscribe("chatHistory", { room: state.get("currentRoomId") }); });  // Causes the function passed to `Tracker.autorun` to be rerun, so that the // 'chatHistory' subscription is moved to the room 'general'. state.set("currentRoomId", "general");

ReactiveDict.set can also be called with an object of keys and values, which is equivalent to calling ReactiveDict.set individually on each key/value pair.

import { ReactiveDict } from "meteor/reactive-dict"; const state = new ReactiveDict(); state.set({  a: "foo",  b: "bar", });

reactiveDict.setDefault

Client only

Summary:

Set a value for a key if it hasn't been set before. Otherwise works exactly the same as ReactiveDict.set.

Arguments:

Source code

Name	Type	Description	Required
key	String	The key to set, eg, selectedItem	Yes
value	EJSONable or undefined	The new value for key	Yes

 // reactiveDict is an instance of ReactiveDict  const result = reactiveDict.setDefault();  "key",
 { num: 42 , someProp: "foo" }, );

This is useful in initialization code, to avoid re-initializing your state every time a new version of your app is loaded.

reactiveDict.get

Client only

Summary:

Get the value assiciated with a key. If inside a reactive computation, invalidate the computation the next time the value associated with this key is changed by ReactiveDict.set. This returns a clone of the value, so if it's an object or an array, mutating the returned value has no effect on the value stored in the ReactiveDict.

Arguments:

Source code

Name	Type	Description	Required
key	String	The key of the element to return	Yes

 // reactiveDict is an instance of ReactiveDict  const result = reactiveDict.get();  "key" );

Example in Blaze:

main.html

<template name="main">  <p>We've always been at war with {{theEnemy}}.</p>  <button class="change-enemy">Change Enemy</button> </template>

main.js

Template.main.onCreated(function () {  this.state = new ReactiveDict();  this.state.set("enemy", "Eastasia"); }); Template.main.helpers({  theEnemy() {  const inst = Template.instance();  return inst.state.get("enemy");  }, }); Template.main.events({  "click .change-enemy"(event, inst) {  inst.state.set("enemy", "Eurasia");  }, });  // Clicking the button will change the page to say "We've always been at war with Eurasia"

reactiveDict.delete

Client only

Summary:

remove a key-value pair from the ReactiveDict. Notify any listeners that the value has changed (eg: redraw templates, and rerun any Tracker.autorun computations, that called ReactiveDict.get on this key.)

Arguments:

Source code

Name	Type	Description	Required
key	String	The key to delete, eg, selectedItem	Yes

 // reactiveDict is an instance of ReactiveDict  const result = reactiveDict.delete();  "key" );

reactiveDict.equals

Client only

Summary:

Test if the stored entry for a key is equal to a value. If inside a reactive computation, invalidate the computation the next time the variable changes to or from the value.

Arguments:

Source code

Name	Type	Description	Required
key	String	The name of the session variable to test	Yes
value	String, Number, Boolean, null or undefined	The value to test against	Yes

 // reactiveDict is an instance of ReactiveDict  const result = reactiveDict.equals();  "key",
 "value", );

If value is a scalar, then these two expressions do the same thing:

import { ReactiveDict } from "meteor/reactive-dict"; const state = new ReactiveDict(); // ... state.get("key") === value; state.equals("key", value);

However, the second is recommended, as it triggers fewer invalidations (template redraws), making your program more efficient.

reactiveDict.all

Client only

Summary:

Get all key-value pairs as a plain object. If inside a reactive computation, invalidate the computation the next time the value associated with any key is changed by ReactiveDict.set. This returns a clone of each value, so if it's an object or an array, mutating the returned value has no effect on the value stored in the ReactiveDict.

 // reactiveDict is an instance of ReactiveDict  const result = reactiveDict.all();  );

reactiveDict.clear

Client only

Summary:

remove all key-value pairs from the ReactiveDict. Notify any listeners that the value has changed (eg: redraw templates, and rerun any Tracker.autorun computations, that called ReactiveDict.get on this key.)

 // reactiveDict is an instance of ReactiveDict  const result = reactiveDict.clear();  );

reactiveDict.destroy

Client only

Summary:

Clear all values from the reactiveDict and prevent it from being migrated on a Hot Code Pushes. Notify any listeners that the value has changed (eg: redraw templates, and rerun any Tracker.autorun computations, that called ReactiveDict.get on this key.)

 // reactiveDict is an instance of ReactiveDict  const result = reactiveDict.destroy();  );