2017-02-15 9 views
0

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

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> 

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

+0

あなたのサンプルコードを理解しようとしている... LOCATION.HREF変更するには、私には奇妙に思えるし、その後this.HeaderTitleを設定します。このコードはmenu.htmlページで実行されますか?もしそうなら、(location.hrefを設定して)ページを再読み込みし、Vueオブジェクトを初期状態にリセットする可能性がありますか? window.location.href行をコメントアウトすると動作しますか? – Peter

+0

私はhrefを変更する理由は、別のページにある "login.html .Iコードの別の部分にあるので、私は1.それがtrueを返すと、ログインを認証する(それ)私はapp2.loadMENU(データ)を呼び出します。ここではデータはJSONオブジェクトですが、Menu.htmlページを読み込んでその中のすべての情報を更新します。ページを読み込むことはできますが、上記のように情報は更新されません。 ' –

+1

これは私が理解していると思います。location.hrefを設定すると、ブラウザは新しいページに移動し、現在のページから状態を消去します。この同じスクリプトを新しいページで実行すると新しいVueインスタンスが作成されます(HeaderTitleの初期値は「変更されません」)。 – Peter

答えて

0

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

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; 

    } 
} }); 
関連する問題