Vueのクリックイベント時に式を実行させることがうまくいきません。
の続き
教えていただいた情報をもとに下記のようにしたのですが二つ目だけうまくいって一つ目がうまくいきません。もしかして一つのvueに二つ入れてはいけないのでしょうか?
また、
this.headdingのthisはの子要素であるv-text="headding"の中に指定のテキストを入れるという意味でよいでしょうか?
var app = new Vue({
el: '#vueHook1',
data: {
headding: '当社のダミー商品1つめを紹介します。',
description1: '1. 当社のダミー商品1つめを紹介します。...',
description2: '2. 当社のダミー商品1つめを紹介します。...',
},
methods: {
change: function() {
this.headding = '当社のダミー商品2つめを紹介します。';
this.description1 = '1. 当社のダミー商品2つめを紹介します。...';
this.description2 = '2. 当社のダミー商品2つめを紹介します。...';
}
},
el: '#vueHook2',
data: {
headding: '当社のダミー商品1つめを紹介します。',
description1: '1. 当社のダミー商品1つめを紹介します。...',
description2: '2. 当社のダミー商品1つめを紹介します。...',
},
methods: {
change2: function() {
this.headding = '当社のダミー商品2つめを紹介します。';
this.description1 = '1. 当社のダミー商品2つめを紹介します。...';
this.description2 = '2. 当社のダミー商品2つめを紹介します。...';
}
}
})