2017-02-10 9 views
0

私のコンポーネントvue.jsはこのようなものです:解決方法 "未知(未定)TypeError:response.body.forEachは関数ではありません" (vue.js 2)

<script> 
    export default{ 
    name: 'CategoryBsSelect', 

    template: '\ 
     <select class="form-control" v-model="selected" required>\ 
     <option v-for="option in options" v-bind:value="option.id" v-bind:disabled="option.disabled">{{ option.name }}</option>\ 
     </select>', 

    //props: {list: {type: String, default: ''}}, 

    mounted() { 
     this.fetchList(); 
    }, 

    data() { 
     return { 
     selected: '', 
     options: [{id: '', name: 'Select Category'}] 
     }; 
    }, 

    methods: { 
     fetchList: function() { 
      this.$http.post(window.BaseUrl+'/member/category/list').then(function (response) { 
       //this.$set('list', response.data); 
       console.log(JSON.stringify(response.body)) 
       response.body.forEach(function(item){ 
        this.$set(this.options, item.id, item); 
       }, this); 
      }); 
     }, 
    } 

    }; 

</script> 

console.log(JSON.stringify(response.body))の結果:

{"20":"Category 1","21":"Category 2","22":"Category 3"}

が、私は選択の値に応答を表示します。実行された場合にでも、コンソールにこのようなエラーが存在します。

Uncaught (in promise) TypeError: response.body.forEach is not a function at VueComponent.

私を助けることができる人はいますか?

+4

オブジェクトは 'forEach'が持っていない - あなたは' item'と 'item.id'があることを期待しますどのような' Object.keys' –

+0

を使うのか? – Bergi

答えて

0

使用

Object.keys(response.body).map(function(key) { 
    this.$set(this.options, key, response.body[key]); 
}); 
+0

なぜ 'map'ですか?あなたの関数は何も返さない。 – Bergi

+0

単純な 'for'ループはなぜでしょうか? – Bergi

関連する問題