2017-07-31 8 views
2

私は分離DOMパターンの概念実証に取り組んでおり、Browserifyをアセットパイプラインとして使用しています。その結果、私はコードに必要なモジュールを「必要としています」。この非常に簡単なコード例を参照してください。独自のモジュールを要求する

var loginForm = require('page-objects/loginForm'); 

lf = loginForm(); 

lf.signInButton.on('click', function(event){ 
    event.preventDefault(); 
    lf.email.val('TEST') 
}) 

、ここでは、ページオブジェクトである:

module.exports = LoginForm; 

function LoginForm(){ 
    var $ = require('jQuery'), 
    navbarForm = $('form.navbar-form'); 

    return { 
     email: navbarForm.find('input[placeholder="Email"]'), 
     password: navbarForm.find('input[placeholder="Password"]'), 
     signInButton: navbarForm.find(':button') 
    } 
} 

私は理解していないと私はインスタンス化する必要がある理由として答えを返す検索を見つけることができませんそれらを使用するオブジェクト。私がBrowserify GitHubとハンドブックで見つけた例では、それが要件として示されていません。しかし、もし私がこのようなオブジェクトを自分のコードに "新しくしない"とすれば、モジュールは見つかりませんでした...なぜそうなっているのか知りたいのですが。私のコードに変更を加える必要はありませんか?オブジェクトのインスタンス化せずに

コード:

var loginForm = require('page-objects/loginForm'); 

loginForm.signInButton.on('click', function(event){ 
    event.preventDefault(); 
    loginForm .email.val('TEST') 
}) 
+0

*新しいコードは表示されませんか? –

+0

オブジェクトのインスタンス化のないコードを含めるように編集しました –

答えて

0

このとき、あなたはオブジェクトを返す関数をエクスポートします。オブジェクトを取得するには、エクスポートされた関数を最初に実行する必要があります。関数を最初に実行せずにオブジェクトを呼び出す場合は、関数の代わりにオブジェクトをエクスポートしてください:

var $ = require('jQuery'), 
var navbarForm = $('form.navbar-form'); 

module.exports = { 
    email: navbarForm.find('input[placeholder="Email"]'), 
    password: navbarForm.find('input[placeholder="Password"]'), 
    signInButton: navbarForm.find(':button') 
} 
関連する問題