Vue JsがJSONから更新しない

Question

このJSONオブジェクトを取得してこのVueに渡しています。しかし、私のページでは更新されていませんが、window.alert（jobj.Name）がうまく動作するので、オブジェクトはそこにあります。ここに私の意見と私の見解があります。

var app2 = new Vue({ 
el: '#menuPage', 

data: { 
    HeaderTitle: 'NOT CHANGED', 
    content_body: 'test body', 
}, 
methods: { 
    loadMENU: function (jobj) { 

     app2 = this; 
     window.location.href = "tools/menu.html"; //relative to domain 

     window.alert(jobj.Name); 
     this.HeaderTitle = jobj.Name; 

    } 
} }); 




    <div id="menuPage">{{HeaderTitle}}</div> 

オブジェクト名の代わりに「変更されていません」と表示されます。

Answer 1

メソッドを呼び出さなかった。メソッドをトリガーするには、ボタンを使用する必要があります。

HTML

<div id="menuPage">{{HeaderTitle}} 
    <button v-on:click="loadMENU">button</button> 
</div> 

javascriptの

var app2 = new Vue({ 
el: '#menuPage', 

data: { 
    HeaderTitle: 'NOT CHANGED', 
    content_body: 'test body', 
}, 
methods: { 
    loadMENU: function() { 

     app2 = this; 
     const herf = window.location.href; 
     window.alert(herf); 
     this.HeaderTitle = herf; 

    } 
} });