vuejsコンポーネントで更新されたデータを返す方法

Question

コンポーネントVuejsをテストしたいと思います。 私はavoriaz、jsdom、mocha、およびchaiを使用します。

<template> 
<div id="test-event" class="test-event"> 
<button id="button" v-on:click="plusClick" v-bind:value="click_count">{{click_count + " elements"}} 
</button> 
</div> 
</template> 

<script> 
export default { 
    data() { 
     click_count: 0 
    }, 

methods: { 
     plusClick(event) { 
      console.log("element = ", this.click_count) 
      return this.click_count = Number(event.target.value) + Number(1); 
     }, 
     get_click_count() { 
      console.log(" => ", this.click_count); 
      return this.click_count; 
     }, 

watch : { 
     click_count: function(element) { 
      console.log("element = ", element); 
     } 
    } 
</script> 

私のユニットテスト

it('render button be called ', function() { 

    const wrapper = mount(Bar);  
    expect(wrapper.contains('#test-event')).to.equal(true); //ok 
    var test_event = wrapper.find('#test-event');   //ok 
    expect(test_event[0].contains('button')).to.equal(true); //ok 
    var button_test = test_event[0].find('button')[0];  //ok 

    button_test.simulate('click'); // element = 0 
    button_test.simulate('click'); // element = 1 

    console.log(wrapper.data().click_count);  // 0 
    console.log(wrapper.methods.get_click_count()): 
    // error wrapper.methods.get_click_count() is not a function 
    console.log(wrapper.methods.get_click_count): // undefined 
    button_test.simulate('click'); // element = 3 
    button_test.simulate('click'); // element = 4 

}); 

私はどのように私は、この値をキャッチすることができclick_count更新の値を取得けど...したいですか？

Answer 1

私の知る限りはVue.jsを知っているように、私がしようとするだろう：

wrapper.get_click_count()を値click_countを取得するには、実際の方法、

wrapper.$data.click_countを呼び出すために：

Answer 2

wrapper.vm.get_click_countは、メソッドを呼び出します。

wrapper.vm.click_countまたはwrapper.data().click_countがデータを取得します。

.methods() methodもあります。 thisを使用するメソッドを呼び出すときに問題があります。