Ajax Request Vue2からのデータの初期化

Question

コンソールのshow testDataは空の配列です。これは、成功するajaxリクエスト関数の中で、 'paterns'値がまだ更新されていないことを意味します。 「paterns」値にデータ応答を割り当てる方法を誰かに教えてもらえますか？

Answer 1

慎重にVueJS Tutorialsを読むことができます。

あなたはそのデータオプションとしてVueのインスタンスへのJavaScriptオブジェクトプレーンを渡すと、Vueがそのすべてのプロパティを歩くとObject.definePropertyを使用して/セッターをゲッタリングするためにそれらを変換します。これはES5のみでシームレスな機能なので、VueはIE8以下をサポートしていません。

getter/setterはユーザーには表示されませんが、プロパティにアクセスまたは変更したときにVueが依存関係追跡と変更通知を実行できるようにします。 1つの注意点は、変換されたデータオブジェクトがログに記録されるときに、ブラウザがフォーマットゲッター/セッターを異なる方法で扱うことです。したがって、検査にやさしいインターフェースを提供するためにvue-devtoolsをインストールすることができます。

VueJSが "プロキシ"のような処理をする反応データで、Objectの値に割り当てることができませんでした。

// Wrong 
self.paterns = response.data; 

// Right 
self.someObject = Object.assign({}, self.someObject, response.data) 

そしてdataはまだ空の配列を得たObject

data: { 
    patterns: [] 
}