2016-04-21 10 views
0

MeteorIron Routerの簡単なログイン、登録、ログアウトメニューを作成します。 Iron Routerパッケージを使用する前に、新しいユーザーを送信して簡単にログインまたはログアウトすることができました。したがって、私のHTML文書にこのコードがありました:Meteor - Ironでルートを追加した後にユーザーを送信できません。ログインと登録フォームに戻る

<body> 
    {{#if currentUser}} 
    {{> dashboard}} 
    {{else}} 
    {{> register}}<br> 
    {{> login}} 
    {{/if}} 
</body> 

ここで、ログインと登録フォームをルーティングします。ログインボタンを押すと、lochalhost:3000ログイン(これは正常に動作します)を取得する必要があります。

しかし私にはわからない:

  • を、私は、新しいユーザーを提出できない理由はもう
  • 私はダッシュボードのルートに成功したログインルートから変更することができますどのよう
  • 、おそらくどうすればログアウトできますか(まだテストできませんでした)

私はJSとMeteorを初めて使いました。それでも私はインターネットで解決策を見つけたり、自分で修正する方法は見つけられませんでした。

私の完全な文書は次のようになります。

  • main.htmlと:

    <head> 
        <title>Routing</title> 
    </head> 
    
    <body> 
        {{#if currentUser}} 
        {{> dashboard}} 
        <!--{{else}} 
        {{> register}}<br> 
        {{> login}} --> 
        {{/if}} 
    </body> 
    
    <template name="main"> 
        <h1>Text</h1> 
        {{> navigation}} 
        {{> yield}} 
        <hr /> 
        <p> 
         Copyright &copy; 
        </p> 
    </template> 
    
    <template name="home"> 
        <p> 
        Welcome to the <b>Text</b> website. 
        </p> 
    </template> 
    
    <template name="navigation"> 
        <ul> 
        <li><a href="{{pathFor route='home'}}">Home</a></li> 
        <li><a href="{{pathFor route='register'}}">Register</a></li> 
        <li><a href="{{pathFor route='login'}}">Login</a></li> 
        </ul> 
    </template> 
    
    <template name="register"> 
        <form> 
        <input type="text" id="username"> 
        <input type="text" id="email"> 
        <input type="password" id="password"> 
        <input type="submit" value="Register"> 
        </form> 
    </template> 
    
    <template name="login"> 
        <form> 
        <input type="text" id="login-email"> 
        <input type="password" id="login-password"> 
        <input type="submit" value="Login"> 
        </form> 
    </template> 
    
    <template name="dashboard"> 
        <p> 
        Yor're logged in. 
        <a href="{{pathFor route='home'}}" class="logout">Logout</a> 
        </p> 
    </template> 
    
  • main.js

    Router.route('register'); // Default name is register 
        Router.route('login'); // Default name is login 
        Router.route('dashboard'); 
        Router.route('/', { 
        name: 'home', 
        template: 'home' 
        }); 
    
        Router.configure({ 
        layoutTemplate: 'main' 
        }); 
    
    
        if (Meteor.isClient) { 
        Template.register.events({ 
         'submit form': function(event, template) { 
         event.preventDefault(); 
         var usernameVar = template.find('#username').value; 
         var emailVar = template.find('#email').value; 
         var passwordVar = template.find('#password').value; 
         Accounts.createUser({ 
          username: usernameVar, 
          email: emailVar, 
          password: passwordVar 
         }) 
         } 
        }); 
    
    Template.login.events({ 
        'submit form': function(event, template) { 
        event.preventDefault(); 
        var emailVar = template.find('#login-email').value; 
        var passwordVar = template.find('#login-password').value; 
        Meteor.loginWithPassword(emailVar, passwordVar); 
        } 
    }); 
    Template.dashboard.events({ 
        'click .logout': function(event) { 
        event.preventDefault(); 
        Meteor.logout(); 
        prompt("You successfully logged out"); 
        } 
    }); 
    

    }

そして私は、コメントを追加しました:

  • iron:routerパッケージ
  • meteor add accounts-ui accounts-password

答えて

0

を私はより良い理解を持っているアイアンルータや流星の公式ドキュメントを読んでください、と言うでしょう。私はあなたのコードを取って、いくつかのテストを行った、それは正常に動作します。私は鉄を追加しました:router accounts-ui(これについての文書を参照して、簡単なログインとこ​​のパッケージでのサインアップを作成できます)とaccounts-password。

main.htmlを

<head> 
    <title>Routing</title> 
</head> 

<body> 
    {{#if currentUser}} 
    {{> dashboard}} 
    <!--{{else}} 
    {{> register}}<br> 
    {{> login}} --> 
    {{/if}} 
</body> 

<template name="main"> 
    <h1>Text</h1> 
    {{> navigation}} 
    {{> yield}} 
    <hr /> 
    <p> 
     Copyright &copy; 
    </p> 
</template> 

<template name="home"> 
    <p> 
    Welcome to the <b>Text</b> website. 
    </p> 
</template> 

<template name="navigation"> 
    <ul> 
    <li><a href="{{pathFor route='home'}}">Home</a></li> 
    {{#unless currentUser}} 
    <li><a href="{{pathFor route='register'}}">Register</a></li> 
    <li><a href="{{pathFor route='login'}}">Login</a></li> 
    {{/unless}} 
    </ul> 
</template> 

<template name="register"> 
    {{#unless currentUser}} 
    <form> 
    <input type="text" id="username"> 
    <input type="text" id="email"> 
    <input type="password" id="password"> 
    <input type="submit" value="Register"> 
    </form> 
    {{/unless}} 
</template> 

<template name="login"> 
    {{#unless currentUser}} 
    <form> 
    <input type="text" id="login-email"> 
    <input type="password" id="login-password"> 
    <input type="submit" value="Login"> 
    </form> 
    {{/unless}} 
</template> 

<template name="dashboard"> 
    <p> 
    Yor're logged in. 
    <a href="{{pathFor route='home'}}" class="logout">Logout</a> 
    </p> 
</template> 

main.js

goHome =function(){ 
    if(Meteor.userId()){ 
    Router.go('/'); 
    } 
} 


Router.configure({ 
    layoutTemplate: 'main' 
}); 


Router.route('/register', { 
    template:'register', 
    onBeforeAction:function(){ 
    goHome(); 
    this.next(); 
    } 
}); // Default name is register 

Router.route('/login', { 
    template:'login', 
    onBeforeAction:function(){ 
    goHome(); 
    this.next(); 
    } 
}); 

Router.route('/dashboard',{ 
    template:'dashboard' 
}) 

Router.route('/', { 
    name: 'home', 
    template: 'home' 
}); 


if (Meteor.isClient) { 
    Template.register.events({ 
    'submit form': function(event, template) { 
     event.preventDefault(); 
     var usernameVar = template.find('#username').value; 
     var emailVar = template.find('#email').value; 
     var passwordVar = template.find('#password').value; 
     Accounts.createUser({ 
     username: usernameVar, 
     email: emailVar, 
     password: passwordVar 
     }, function(error){ 
     if(!error){ 
      Router.go('/'); 
     } 
     }) 
    } 
    }); 

Template.login.events({ 
'submit form': function(event, template) { 
    event.preventDefault(); 
    var emailVar = template.find('#login-email').value; 
    var passwordVar = template.find('#login-password').value; 
    Meteor.loginWithPassword(emailVar, passwordVar, function(error){ 
    if(!error){ 
     Router.go('/'); 
    } 
    }); 
} 
}); 
Template.dashboard.events({ 
'click .logout': function(event) { 
    event.preventDefault(); 
    Meteor.logout(); 
    prompt("You successfully logged out"); 
} 
}); 
} 
+0

こんにちは、答えてくれてありがとう。あなたは "meteor add useraccounts:iron-routing"を追加しましたか? "iron:router accounts-ui"とは何を意味しますか?コピー貼り付け後、あなたのバージョンは動作しません...私はまだ同じ問題を抱えています。 – LenC

+0

私はちょうどように追加しました: 流星追加鉄:ルータ 流星アカウントを追加する - パスワード 簡単なサインアップとログインの詳細については、私はaccounts-uiのみを掲載しました。これはアカウントなしで動作しますが、このパッケージでは、{{> loginButtons}}を呼び出すだけで簡単にログインとサインアップを作成できます。 –

+0

ありがとう:)別の方法は、Router.go( "path")を追加することです。 – LenC

関連する問題