2016-11-20 8 views
8

私はVueJSを使用して、リソース管理の簡単なゲーム/インターフェイスを作成しています。私は12.3秒ごとにroll機能を有効にして、別の機能で結果を使用することを検討しています。私が試してみました別のメソッドからメソッドにアクセスするVueJS

Uncaught TypeError: Cannot read property 'roll' of undefined(...)

  • app.methods.roll(6);
  • app.methods.roll.roll(6);
  • roll.roll()
  • roll()
瞬間 は、私は次のエラーを得続けるものの

ですが、この機能にアクセスできないようです。どのように私はこれを達成するかもしれない誰のアイデアですか?

methods: { 

    // Push responses to inbox. 
    say: function say(responseText) { 
    console.log(responseText); 
    var pushText = responseText; 
    this.inbox.push({ text: pushText }); 
    }, 

    // Roll for events 
    roll: function roll(upper) { 
    var randomNumber = Math.floor(Math.random() * 6 * upper) + 1; 
    console.log(randomNumber); 
    return randomNumber; 
    }, 

    // Initiates passage of time and rolls counters every 5 time units. 
    count: function count() { 
    function counting() { 
     app.town.date += 1; 
     app.gameState.roll += 0.2; 

     if (app.gameState.roll === 1) { 
     var result = app.methods.roll(6); 
     app.gameState.roll === 0; 
     return result; 
     } 
    } 

    setInterval(counting, 2500); 

    ... 

    // Activates the roll at times. 
    } 
} 
+0

'roll'メソッド?同じコンポーネントの中にありますか?子コンポーネントでは?親コンポーネントですか?兄弟?あるいは、複雑な関係を持つ他の場所? – wing

+0

現在のところ、コンポーネントはまったくありません。私はページの読み込み時にcountメソッドを有効にし、countメソッドの中でrollメソッドを有効にしたいと考えています。この呼び出しは、counting()関数のif文の内部にあります。現時点ではすべてが根本的な範囲にあります。ベアボーンの機能が完了したら、コンポーネントにリファクタリングします。 – Jackanapes

答えて

30

You can access these methods directly on the VM instance, or use them in directive expressions. All methods will have their this context automatically bound to the Vue instance.

からVue API Guide on methods

Vueのインスタンス上のメソッドの中で、あなたはthisを使用してインスタンス上の他のメソッドにアクセスすることができます。あなたは(上記の例ではvmなど)の変数にインスタンスを割り当て、メソッドを呼び出すことができVueのインスタンスの外のメソッドにアクセスするには

var vm = new Vue({ 
    ... 
    methods: { 
    methodA() { 
     // Method A 
    }, 
    methodB() { 
     // Method B 

     // Call `methodA` from inside `methodB` 
     this.methodA() 
    }, 
    }, 
    ... 
}); 

アクセスしようとしている
vm.methodA(); 
+1

私は 'this'を使ってデータにアクセスできますが、メソッドにはアクセスできません。 vuejs 2.0で何か変わったのですか? –

+0

@SumitMurari:コンポーネントのメソッドをどのように定義していますか?上記の答えはVue 2で有効です。 – wing

+1

私は間違いを犯していました。私はajax呼び出しを行い、 'this'を介してappメソッドにアクセスしようとしていました。' var self = this; self.method() 'は私のために働いた。 –

関連する問題