流星：accounts-ui包

Question

我想使用 accounts-ui 包来管理我的应用程序上的帐户，但它目前是一个下拉登录表单。有谁知道如何将它包装在一个按钮中，以便当我单击一个按钮时，帐户登录页面将呈现？

Answer 1

正如 sdybskiy 在 cmets 中已经指出的那样，Meteor accounts-ui 包仅限于下拉形式。但是，您可以使用 User Accounts suite 来包含 Meteor 帐户模块的 UI 模板。

目前，以下versions 可用：

• useraccounts:unstyled – 纯 HTML，无 CSS 规则
• useraccounts:bootstrap – Twitter Bootstrap
• useraccounts:foundation – Zurb Foundation
• useraccounts:ionic – Ionic
• useraccounts:materialize - Materialize
• useraccounts:polymer - Polymer
• useraccounts:ratchet – Ratchet
• useraccounts:semantic-ui - Semantic UI

如果你想安装账户套件，你只需要运行：

1. meteor add useraccounts:<version>，例如：useraccounts:bootstrap。
2. meteor add accounts-<loginService>，例如：accounts-password。

关于路由，还有两个可用的附加组件，useraccounts:iron-routing 和 useraccounts:flow-routing。

因此，如果您想要一个在点击时呈现登录页面的按钮，您可以使用以下代码示例作为起点（假设您使用的是 Iron-Router 和 useraccounts:iron-routing 包）：

<template name="home">
   <button id="login" type="button" class="btn btn-default">Login</button>
</template>

---

Template.home.events({ 
  'click #login': function (event) {
   event.preventDefault();
   Router.go('/login');
});

AccountsTemplates.configureRoute('signIn', {
    name: 'signin',
    path: '/login',
    template: 'myLogin',
    layoutTemplate: 'myLayout',
    redirect: '/user-profile',
});