Vuejsで括弧でデータを指定する最も良い方法は何ですか？

Question

フィールド名が配列型のページがあります。

[Vue warn]: Property or method "map" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option. 

vue.js:569 [Vue warn]: Property or method "email_address" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option. 

vue.js:569 [Vue warn]: Error in render function: 
(found in <Root>) 

は何ですか

eg. mapping[map][email_address][type] 

は今Vueの中で、私は、デフォルト値を設定したいと私は

new Vue({ 
    el: '#configure', 
    data: { 
     mapping: { 
      map: { 
       email_address: { 
        type: 'incoming_field' 
       } 
      } 
     } 
    } 
}) 

以下のようにそれをやっているしかし、私は、コンソールにエラーが発生しますVuejsでそのようなフィールド名を処理する最良の方法は？パーとして

Answer 1

あなたがコードを、あなたがしなければならない。

mapping['map']['email_address']['type'] 

または

mapping.map.email_address.type 

Answer 2

あなたは非常に多くのネストされたオブジェクトを持っていないためにあなたのデータを再考する必要があります。

オブジェクト内に直接プロパティを設定する場合は、Vue.setを使用してyou do not break reactivityを確実に使用することをお勧めします。これを行うと何かが壊れた場所を把握しようとしている頭痛の時間を節約できます。

Vue.set(mapping.map.email_address, 'type', value_to_set)