2: 集合

Meteor 已经为你设置了 MongoDB。为了使用我们的数据库，我们需要创建一个集合，我们将在这里存储我们的文档，在我们的例子中是我们的tasks。

你可以在这里了解更多关于集合的信息。

在此步骤中，我们将实现所有必要的代码，使我们的任务的基本集合能够运行起来。

2.1: 创建 Tasks 集合

我们可以通过在imports/api/TasksCollection.js中创建一个新文件来创建一个新的集合来存储我们的任务，该文件实例化一个新的 Mongo 集合并导出它。

imports/api/TasksCollection.js

import { Mongo } from 'meteor/mongo';
 
export const TasksCollection = new Mongo.Collection('tasks');

请注意，我们将文件存储在imports/api目录中，这是一个存储与 API 相关的代码（如发布和方法）的地方。你可以根据需要命名这个文件夹，这只是一个可选的命名方式。

2.2: 初始化 Tasks 集合

为了使我们的集合能够工作，你需要将其导入到服务器中，以便它能够设置一个基本的结构。

你可以使用import "/imports/api/TasksCollection"或import { TasksCollection } from "/imports/api/TasksCollection"（如果你打算在同一个文件中使用），但请确保它被导入了。

现在很容易检查我们的集合中是否有数据，否则我们可以在需要时轻松插入一些示例数据。

你不需要保留server/main.js的旧内容。

server/main.js

import { Meteor } from 'meteor/meteor';
import { TasksCollection } from '/imports/api/TasksCollection';

const insertTask = taskText => TasksCollection.insert({ text: taskText });
 
Meteor.startup(() => {
  if (TasksCollection.find().count() === 0) {
    [
      'First Task',
      'Second Task',
      'Third Task',
      'Fourth Task',
      'Fifth Task',
      'Sixth Task',
      'Seventh Task'
    ].forEach(insertTask)
  }
});

因此，你正在导入TasksCollection并在一个字符串数组上添加一些任务，并对每个字符串调用一个函数，将此字符串作为我们task文档中的text字段插入。

2.3: 渲染 Tasks 集合

现在到了有趣的部分，你将渲染保存在我们的数据库中的任务。使用 Svelte，这将非常简单。

在你的App.svelte文件中，导入TasksCollection文件，并且，而不是返回一个静态数组，返回保存在数据库中的任务。让我们使用 Svelte 的$ 反应式语句特性的扩展，来维护你的任务，称为$m

imports/ui/App.svelte

<script>
  import Task from './Task.svelte';
  import { TasksCollection } from '../api/TasksCollection';

  $m: tasks = TasksCollection.find({}).fetch()
</script>


<div class="container">
  <header>
    <h1>Todo List</h1>
  </header>

  <ul>
    {#each tasks as task (task._id)}
        <Task task={task} />
    {/each}
  </ul>
</div>

看看你的应用现在应该是什么样子

你可以在 Svelte 的文档中了解更多关于$ 反应式语句的信息。我们将使用$m 跟踪器，它在内部使用Tracker.autorun，它允许你运行一个依赖于反应式数据源的函数，这样，如果稍后数据发生更改，则该函数将重新运行，这使得我们的任务查询成功完成。

$m跟踪器之所以对我们可用，仅仅是因为我们使用了 Svelte 编译器zodern:melte。

你还可以选择使用像rdb:svelte-meteor-data这样的包来访问一些 Meteor 功能，例如useTracker（它与Tracker.autorun具有相同的目的），并且可以使用如下代码而不是使用$m

import { useTracker } from 'meteor/rdb:svelte-meteor-data';

$: tasks = useTracker(() => Tasks.find({}).fetch());

你可以在服务器上的 MongoDB 中更改你的数据，你的应用将做出反应并为你重新渲染。

你可以通过在应用文件夹中的终端中运行meteor mongo或使用 Mongo UI 客户端（如NoSQLBooster）来连接到你的 MongoDB。你的嵌入式 MongoDB 正在端口3001上运行。

查看如何连接

查看你的数据库

你可以双击你的集合以查看存储在其上的文档

但是等等，我的任务是如何从服务器到客户端的？我们将在稍后的发布和订阅步骤中对此进行解释。你现在需要知道的是，你正在将数据库中的所有数据发布到客户端。这将在以后删除，因为我们不想一直发布所有数据。

回顾：你可以查看此步骤结束时你的代码应该是什么样子这里

在下一步中，我们将使用表单创建任务。