从 Meteor 中的导入文件夹渲染模板

Question

据我了解，imports 文件夹的用途是将您导入 main.js 的所有代码存储在 client 文件夹中。我正在尝试实施 easysearch:autosuggest，我在客户端文件夹的 main.html 中得到了一个使用以下内容的基本示例：

<body>

  <div id="render-target"></div>
    <div>
        {{>searchBox}}

    </div>
</body>

<template name="searchBox">

    <div class="autosuggest-component">
        {{> EasySearch.Autosuggest index=PlayersIndex}}
    </div>

</template>

在我的 main.js 客户端文件夹中，我从 '../imports/ui/App.js' 导入 App 并渲染它：

Meteor.startup(() => {

 render(<App />, document.getElementById('render-target'));

});

所以我尝试将 main.html 中的模板粘贴到导入文件夹中 App.js 内的 render() 函数中，但是这给了我一个 unexpected token 错误指向至 {{>searchBox}}。我是 Meteor/node 的新手，我不太确定我做错了什么，还试图从结构的角度了解我做事是否正确。如果我必须构建我的应用程序客户端，导入文件夹有什么意义？我如何使用 App.js 和 render() 让它工作？

Answer 1

这里的问题是您将两个前端库混合在一起。

前端库是我们可以用来帮助我们构建应用程序用户界面的工具。人们与 Meteor 一起使用的一些流行的是 Blaze、React 和 Angular.js

您使用的语法 {{>searchBox}} 是 Blaze 库用来呈现 Blaze 模板的语法。

但是，在您的 Meteor.startup() 块中，您使用的是 React 所需的代码。您还表示您一直在关注 React 教程。不幸的是，你不能混合这两者。

我建议你重新开始 follow this tutorial instead。这与您已经完成的教程完全相同，但它是 Blaze 版本 - 将使用您一直使用的语法 - {{>searchBox}}

希望对你有所帮助

从 Meteor 中的导入文件夹渲染模板

Rendering a template from the imports folder in Meteor

javascript

templates

autosuggest

meteor

meteor-easy-search