响应式字典
ReactiveDict 存储任意一组键值对。使用它来管理组件中的内部状态,例如列表中当前选定的项目。每个键都是独立响应式的,因此对键调用 `set` 将使任何调用 `get` 并使用该键的计算失效,这符合响应式数据源的常规约定。
这意味着,如果您在 Blaze 模板助手内部调用 ReactiveDict#get
('currentList')
,则每当调用 ReactiveDict#set
('currentList', x)
时,模板都会自动重新渲染。
要使用 `ReactiveDict`,请通过在终端中运行以下命令将 `reactive-dict` 包添加到您的项目中
meteor add reactive-dict
ReactiveDict仅客户端
仅客户端
摘要
ReactiveDict 的构造函数,表示键/值对的响应式字典。
参数
源代码名称 | 类型 | 描述 | 必需 |
---|---|---|---|
name | 字符串 | 可选。传递名称时,在热代码推送期间保留内容 | 否 |
initialValue | 对象 | 可选。字典的默认值 | 否 |
import { ReactiveDict } from "meteor/reactive-dict"";
const reactiveDict = new ReactiveDict(
"name", // this param is optional
initialValue, // this param is optional
);
如果您为其构造函数提供了一个名称,则其内容将在热代码推送客户端代码更新期间保存。
reactiveDict.set仅客户端
仅客户端
摘要
为 ReactiveDict 中的键设置一个值。通知所有侦听器值已更改(例如:重新绘制模板,并重新运行任何在该 `key` 上调用了 ReactiveDict.get
的 Tracker.autorun
计算)。
参数
源代码名称 | 类型 | 描述 | 必需 |
---|---|---|---|
key | 字符串 | 要设置的键,例如 `selectedItem` | 是 |
value | 可 EJSON 化或未定义 | `key` 的新值 | 是 |
示例
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` 也可以使用键和值的 对象调用,这等效于单独在每个键/值对上调用 `ReactiveDict.set`。
import { ReactiveDict } from "meteor/reactive-dict";
const state = new ReactiveDict();
state.set({
a: "foo",
b: "bar",
});
reactiveDict.setDefault仅客户端
仅客户端
摘要
如果之前未设置键的值,则为其设置值。否则,其工作方式与 ReactiveDict.set
完全相同。
参数
源代码名称 | 类型 | 描述 | 必需 |
---|---|---|---|
key | 字符串 | 要设置的键,例如 `selectedItem` | 是 |
value | 可 EJSON 化或未定义 | `key` 的新值 | 是 |
// reactiveDict is an instance of ReactiveDict
reactiveDict.setDefault(
"key",
{ num: 42 , someProp: "foo" },
);
这在初始化代码中很有用,可以避免每次加载应用程序的新版本时都重新初始化状态。
reactiveDict.get仅客户端
仅客户端
摘要
获取与键关联的值。如果在 响应式计算 中,则在下一次通过 ReactiveDict.set
更改与该键关联的值时使计算失效。这会返回值的克隆,因此如果它是一个对象或数组,则更改返回值不会影响存储在 ReactiveDict 中的值。
参数
源代码名称 | 类型 | 描述 | 必需 |
---|---|---|---|
key | 字符串 | 要返回的元素的键 | 是 |
// reactiveDict is an instance of ReactiveDict
reactiveDict.get(
"key"
);
Blaze 中的示例
<template name="main">
<p>We've always been at war with {{theEnemy}}.</p>
<button class="change-enemy">Change Enemy</button>
</template>
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仅客户端
仅客户端
摘要
从 ReactiveDict 中删除键值对。通知所有侦听器值已更改(例如:重新绘制模板,并重新运行任何在该 `key` 上调用了 ReactiveDict.get
的 Tracker.autorun
计算)。
参数
源代码名称 | 类型 | 描述 | 必需 |
---|---|---|---|
key | 字符串 | 要删除的键,例如 `selectedItem` | 是 |
// reactiveDict is an instance of ReactiveDict
reactiveDict.delete(
"key"
);
reactiveDict.equals仅客户端
仅客户端
摘要
测试键的存储条目是否等于某个值。如果在 响应式计算 中,则在下一次变量更改为或从该值更改时使计算失效。
参数
源代码名称 | 类型 | 描述 | 必需 |
---|---|---|---|
key | 字符串 | 要测试的会话变量的名称 | 是 |
value | 字符串、数字、布尔值、null 或未定义 | 要测试的值 | 是 |
// reactiveDict is an instance of ReactiveDict
reactiveDict.equals(
"key",
"value",
);
如果 value 是标量,则这两个表达式执行相同的操作
import { ReactiveDict } from "meteor/reactive-dict";
const state = new ReactiveDict();
// ...
state.get("key") === value;
state.equals("key", value);
但是,建议使用第二个表达式,因为它会触发较少的失效(模板重新绘制),从而使您的程序更高效。
reactiveDict.all仅客户端
仅客户端
摘要
获取所有键值对作为普通对象。如果在 响应式计算 中,则在下一次通过 ReactiveDict.set
更改与任何键关联的值时使计算失效。这会返回每个值的克隆,因此如果它是一个对象或数组,则更改返回值不会影响存储在 ReactiveDict 中的值。
// reactiveDict is an instance of ReactiveDict
reactiveDict.all();
reactiveDict.clear仅客户端
仅客户端
摘要
从 ReactiveDict 中删除所有键值对。通知所有侦听器值已更改(例如:重新绘制模板,并重新运行任何在该 `key` 上调用了 ReactiveDict.get
的 Tracker.autorun
计算)。
// reactiveDict is an instance of ReactiveDict
reactiveDict.clear();
reactiveDict.destroy仅客户端
仅客户端
摘要
清除 reactiveDict 中的所有值,并阻止其在热代码推送期间迁移。通知所有侦听器值已更改(例如:重新绘制模板,并重新运行任何在该 `key` 上调用了 ReactiveDict.get
的 Tracker.autorun
计算)。
// reactiveDict is an instance of ReactiveDict
reactiveDict.destroy();