2016-12-01 12 views
0

私はデータを渡すコンポーネントを持っているので、そのデータをクリック時にtrueからfalseに変更する必要があります。私はそれのためにtoggleClassと呼ばれるメソッドを作成しましたが、それは動作していない、と私はエラーを取得していません。 toggleClassがどのように動作するかではありませんVue js - コンポーネントで動作するメソッドを取得する

Vue.component('moustache', { 
name: 'moustache', 
props: ['type', 'img'], 
template: `<li> 
    <p><strong>@{{ type }}</strong></p> 
    <img width="300" height="200" src="/img/image.jpg"> 
    <button class="btn btn-primary" v-bind:class="{ active: isActive }" :data-type="type" @click="toggleClass">Vote</button> 
    </li>`, 
data: function(){ 
    return{ 
     isActive: false 
    } 
}, 
methods: { 
    toggleClass(){ 
      isActive: true 
    } 
} 
}); 

new Vue({ 
    el: '#app' 
}); 

答えて

1

を試みることができる:

toggleClass(){ 
    this.isActive = !this.isActive; 
} 
+0

ありがとう、それは勝者です:) –

-1

、この引数のコマンドがなければならない、あなたはそれが引数に引っかかってしまいます他のパラメータにtrueに設定する必要があります。

あなたはあなたがコンポーネントproperiesにアクセスできるようにthisを使用する必要が

methods: { 
    toggleClass(true){ 
     //  isActive: true 
    } 
} 
}); 
+0

エラーがスローされます申し訳ありませんメイト。 Uncaught SyntaxError:予期せぬトークンの真実 –

関連する問題