教程：使用Atlas Search Atlas Triggers和 在应用程序中构建反向 SearchAtlas Search

创建警报框组件

在模板应用的 src/ 目录中，创建一个新的 AlertBox.tsx 文件并添加以下代码。此文件包含用户界面表单，让您可以输入要触发警报的词语。

import React, {useState} from 'react';
import {StyleSheet, View} from 'react-native';
import {Text, Input, Button} from 'react-native-elements';
import {COLORS} from './Colors';
type Props = {
  onSubmit: ({term}: {term: string}) => void;
};
export function AlertBox(props: Props): React.ReactElement<Props> {
  const {onSubmit} = props;
  const [term, setTerm] = useState('');
  return (
    <View style={styles.modalWrapper}>
      <Text h4 style={styles.addItemTitle}>
        Add Alert Term
      </Text>
      <Input
        placeholder="Enter term"
        onChangeText={(text: string) => setTerm(text)}
        autoCompleteType={undefined}
      />
       <Button
        title="Submit"
        buttonStyle={styles.saveButton}
        onPress={() => onSubmit({term})}
      />
    </View>
  );
}
const styles = StyleSheet.create({
  modalWrapper: {
    width: 300,
    minHeight: 200,
    borderRadius: 4,
    alignItems: 'center',
  },
  addItemTitle: {
    margin: 20,
  },
  saveButton: {
    width: 280,
    backgroundColor: COLORS.primary,
  },
});

更新主视图

在 src/ItemListView.tsx 中，将以下行添加到文件顶部，导入刚刚定义的警报框：

import {AlertBox} from './AlertBox';

然后，添加以下代码以呈现一个按钮，单击该按钮会显示警报框：

• 在 ItemListView 函数区块的顶部，添加一个 useState() 钩子来追踪警报框视图：

  src/ItemListView.tsx

  export function ItemListView() {
    const realm = useRealm();
    const items = useQuery(Item).sorted('_id');
    const user = useUser();
    const [showNewItemOverlay, setShowNewItemOverlay] = useState(false);	
    const [showAlertBox, setShowAlertBox] = useState(false);

• 在主视图中的 Add To-Do 按钮后面，添加一个用于切换警报框覆盖的 Alerts 按钮：

  src/ItemListView.tsx

  return (
    <SafeAreaProvider>
      <View style={styles.viewWrapper}>
        ...
        <Button
          title="Add To-Do"
          buttonStyle={styles.addToDoButton}
          onPress={() => setShowNewItemOverlay(true)}
          icon={
            <Icon
              type="material"
              name={'playlist-add'}
              style={styles.showCompletedIcon}
              color="#fff"
              tvParallaxProperties={undefined}
            />
          }
        />
        <Button
          title="Alerts"
          buttonStyle={styles.alertButton}
          onPress={() => setShowAlertBox(true)}
          icon={
            <Icon
              type="material"
              name={'add-alert'}
              style={styles.showCompletedIcon}
              color="#fff"
              tvParallaxProperties={undefined}
            />
          }
        />
        <Overlay
          isVisible={showAlertBox}
          onBackdropPress={() => setShowAlertBox(false)}>
          <AlertBox
            onSubmit={({term}) => {
              setShowAlertBox(false);
            }}
          />
        </Overlay>
      </View>
    </SafeAreaProvider>
  );

• 要更改按钮的大小和颜色，请在文件底部的 styles 区块中添加以下几行：

  src/ItemListView.tsx

  const styles = StyleSheet.create({
    ... 
    toggleText: {
      flex: 1,
      fontSize: 16,
    },
    alertButton: {
      backgroundColor: '#808080',
      borderRadius: 4,
      margin: 5,
    }
  });

创建新集合

在 Atlas 用户界面中，创建一个集合来存储用户在应用中输入的词语：

1. 如果尚未进入 Database Deployments页面，请单击Data Services标签页。

2. 对于同步到模板应用的部署，请单击 Browse Collections（浏览集合）。

3. 在左侧导航栏中，单击 todo 数据库旁边的 + 图标以添加新集合。

4. 将集合命名为 alerts，然后单击 Create（创建）以保存集合。

启用对集合的访问

创建集合后，必须赋予应用必要的权限，以便写入 todo.alerts 集合：

1. 单击 App Services 标签页。

2. 单击您的应用对应的图块。

3. 在左侧导航栏中的 Data Access（数据访问）下，单击 Rules（规则）。

4. 在 todo 数据库下，单击 alerts 集合。

5. 在右侧对话框中，选择 readAndWriteAll 预设角色。

6. 单击 Add preset role 以确认您的选择。

7. 默认情况下，应用程序启用部署草稿。要手动部署更改，请单击 Review Draft & Deploy（查看草稿和部署），然后单击 Deploy（部署）。

写入集合

配置对 todo.alerts 集合的写入访问权限后，返回到应用程序代码。

在 src/ItemListView.tsx 中，将以下行添加到函数区块的顶部，以创建写入集合的辅助函数：

export function ItemListView() {
  const realm = useRealm();
  const items = useQuery(Item).sorted('_id');
  const user = useUser();
  // addAlert() takes a string input and inserts it as a document in the todo.alerts collection
  const addAlert = async (text: string) => {
    const mongodb = user?.mongoClient("mongodb-atlas");
    const alertTerms = mongodb?.db("todo").collection("alerts");
    await alertTerms?.insertOne({ term: text.toLowerCase() });
  };

addAlert() 函数接受字符串输入，使用 React Native SDK 连接到 Atlas，并将指定的警报词语作为文档插入集合中。

然后，将以下行添加到警报框提交处理程序，以便在用户于应用中提交警报词时调用 addAlert()：

<Overlay
  isVisible={showAlertBox}
  onBackdropPress={() => setShowAlertBox(false)}>
  <AlertBox
    onSubmit={({term}) => {
      setShowAlertBox(false);
      addAlert(term);
    }}
  />
</Overlay>

运行并测试应用

您的应用现在应该允许用户一次输入一个警报词并存储在 Atlas 中。

重新生成应用并将其打开。提交一些要予以警报的词语，例如 important 或 urgent。然后，在 todo.alerts 集合中查看您的文档，确认这些词语出现在 Atlas 中。

创建 Atlas Search 索引

要对您的数据运行 Atlas Search 查询，必须先创建一个 Atlas Search 索引来映射集合中的字段。在 Atlas UI 中，在 todo.Item 集合上创建搜索索引：

1. 单击 Data Services（数据服务）标签页返回到 Database Deployments（数据库部署）页面。

2. 点击同步到模板应用的部署名称，然后点击“ Search ”标签页。

3. 要创建您的第一个 Atlas Search 索引，请单击 Create Search Index（创建搜索索引）。

4. 在 Configuration Method（配置方法）页面中选择 Visual Editor（可视化编辑器），然后单击 Next（下一步）。

5. 将 Index Name（索引名称）设置保留为 default（默认值）。

6. 在 Database and Collection（数据库和集合）部分中找到 todo 数据库，然后选择 Item 集合。

7. 单击 Next（下一步），在检查完索引后单击 Create Search Index（创建搜索索引）。

8. 等待索引完成构建。

   构建索引大约需要一分钟时间。构建完成后，Status（状态）列显示 Active。

Add a Database Trigger

要打开 App Services 用户界面中的数据库触发器配置页面：

1. 单击 App Services 标签页，然后选择您的应用对应的图块。

2. 在左侧导航菜单中，单击 Triggers。

3. 单击 Add a Trigger（添加触发器），Trigger type（触发器类型）设置保留为 Database（数据库）不变。

4. 将触发器命名为 sendAlerts。

5. 配置触发器仅侦听插入到 todo.Item 集合中的新任务文档：

   • 对于 Cluster Name，选择同步到模板应用的部署。

   • 对于 Database Name（数据库名称）和 Collection Name（集合名称），选择 todo 数据库和 Item 集合。

   • 对于 Operation Type（操作类型），选择 Insert（插入）。

   • 启用 Full Document（完整文档）以将每个新报告文档包含在传递给触发器函数的变更事件中。

定义 Atlas Function

导航至触发器配置页面的 Function（函数）部分，并从下拉菜单中选择 + New Function（新增函数）。然后，定义触发器的函数：

1. 将函数命名为 triggers/sendAlerts。

2. 将以下代码复制到函数主体中：

   functions/triggers/sendAlerts.js

   exports = async function(changeEvent) {
     
     // Read the summary field from the latest inserted document
     const fullDocument = changeEvent.fullDocument;
     const summary = fullDocument.summary;
     // Connect to your Atlas deployment    
     const mongodb = context.services.get("mongodb-atlas");
     // Read task and alert data from collections in the todo database
     const tasks = mongodb.db("todo").collection("Item");
     const alerts = mongodb.db("todo").collection("alerts");
     const terms = await alerts.distinct("term");
     
     // Check if the task summary matches any of the terms in the alerts collection
     for (let i = 0; i < terms.length ; i++) {
       if (summary.toLowerCase().includes(terms[i])) {
         console.log("The following task has been added to a to-do list: " + summary +
           ". You've been alerted because it contains the term, " + terms[i] + ".");
         // Aggregates any tasks that also contain the term by using an Atlas Search query
         const query = await tasks
         .aggregate([
           {
             $search: {
               compound: {
                 must: [{
                   phrase: {
                     query: terms[i],
                     path: "summary",
                   },
                 }], 
                 mustNot: [{
                   equals: {
                   path: "isComplete",
                   value: true,
                   },
                 }],
               },
             },
           },
           {
             $limit: 5,
           },
           {
             $project: {
               _id: 0,
               summary: 1,
             },
           },
         ])
         .toArray();
         
         relatedTerms = JSON.stringify(query);
         if (relatedTerms != '[]') {
           console.log("Related incomplete tasks: " + relatedTerms);
         }
       }
     }
   };

   当用户输入的任务包含 todo.alerts 集合中存储的词语时，此 JavaScript 函数会在您的应用程序日志中返回一条消息。

   该函数还包括 Atlas Search 查询，用于查找 todo.Item 集合中包含相同警报词的其他任务文档。查询使用：

   • $search 管道阶段，以查询集合。

   • 以下复合操作符子句：

     • must 子句和 phrase 操作符，查询任何带有 summary 且其中包含警报词的任务。

     • mustNot 子句和 equals 操作符，排除已完成的任务。

   • $limit 阶段将输出限制为 5 个结果。

   • $project 阶段，排除 summary 之外的所有字段。

   注意

   如要了解更多信息，请参阅创建和运行 Atlas Search 查询。

3. 完成后，单击 Save（保存）并部署触发器。

运行并测试应用

Atlas 现在已设置为当用户在应用中创建包含警报词的任务时向您发出警报。

重新构建并运行应用，以确保一切正常。输入几个任务，这些任务包含您之前输入的警报词语。然后查看日志，以查看触发器的输出。您可以从下拉菜单中选择 Triggers（触发器）类型来筛选触发器日志。

例如，如果您的警报词之一是 important，则新任务的日志输出可能类似于以下所示：

Logs:
[
   "The following task has been added to a to-do list: Complete important tutorial.
   You've been alerted because it contains the term, important.",
   "Related incomplete tasks: [
   {"summary": "Important: Create template app"},
   {"summary": "Add important tasks"},
   {"summary": "Make sure to read the documentation. This is important."}]"
]