react-pouchdb-changes 的更广泛的示例实现代码答案

【问题标题】：more extensive example implementation code for react-pouchdb-changesreact-pouchdb-changes 的更广泛的示例实现代码
【发布时间】：2017-03-24 05:54:41
【问题描述】：

我对 pouchdb 和 react 都是新手。我找到了 react-pouchdb-changes 模块，它看起来与我想要使用的完全一样。

但是，它提供的示例代码太少了 - 我真的不知道如何将它合并到基本的反应应用程序中。

有人可以提供更完整的示例用法，并对每个部分的作用进行一些基本解释吗？

【问题讨论】：

标签： reactjs pouchdb

【解决方案1】：

这个模块似乎只是changes 方法的一个包装器。你可以得到一个活生生的例子here。链接来自documentation。

如果信息不足，您可以查看API reference 的示例和示例响应。

【讨论】：

谢谢。我对 pouchdb 部分的工作原理有所了解，但我不清楚它如何与 react 集成。提供的示例似乎显示了伪代码，并且没有解释我将如何将其合并到我的 react 应用程序中。例如，我的应用程序以：“ var Basebuilder = React.createClass({" - 我会改为扩展 PouchDBChanges 吗？

【解决方案2】：

如何让 react-pouchdb-changes 与 React 集成取决于您。它所做的只是为您提供一个组件来放置您的 onChange 处理程序。代码示例的这些部分是相关的：

<PouchDBChanges
  …
  onChange={change => console.log(change) /* do something useful with the change here instead of just logging it! */}
>
 {/* your <App> component here */}
</PouchDBChanges>

只需在您的 JSX 代码中使用该组件（用它包装您的主组件或任何容器组件）。

如果您在设置 React 示例时遇到困难，请尝试使用 create-react-app。您将在几秒钟内拥有一个正在运行的 React 应用程序。添加<PouchDBChanges> 组件的好地方是src/App.js - 只需用组件包裹最外层的<div>。

【讨论】：