Почему компонент VUE.jsне видит свойства?

Question

[Vanya Huk]

Почему компонент не видит свойства product?

Vue.component('catalog-content-wrap', {
    template: '#catalog-content-wrap',

    data : function () {
        return{
                        products    : [],

                        filters     : [],

                        message     : 'hello'
                        }
    },

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

    methods : {

        get_catalog_content : function () {

            this.loader = true;

            this.$http.post( Website.href ).then(response => {
                this.products = response.body.products;
                console.log( response.body.products )
            } );

        }
    }
})

<script type="text/x-template" id="catalog-content-wrap">
        <div class="row no-margin catalog-content-wrap" id="catalog-content-wrap" >

            <div class="col-md-4 col-sm-4 col-xs-6 mob-product" v-for="product in products">
                {{product}}
</div>
</div>
             
    </script>

Comments

[Vanya Huk]

Антон Антон: оно не работает даже если вбить статически products : [{title : 1}, {title : 2}],

[Антон Антон]

Vanya Huk: ну, у меня - работает: https://jsfiddle.net/4o0wk944/

[Vanya Huk]

Антон Антон: хмм, странно, но у меня не работает, попросту переменную не видит(

[Антон Антон]

Vanya Huk: все-таки вероятно, ошибка в ответе сервера, потому что так тоже работает: https://jsfiddle.net/4o0wk944/1/

[Vanya Huk]

Антон Антон: нее, я статически уже вбиваю данные, результат тот же, переменную не видить почемуто

[Vanya Huk]

Антон Антон: причина была в подключении темплейта

Answer 1

[Сергей Казаков]

this.$http.post( Website.href ).then(response => {
                this.products = response.body.products;
                console.log( response.body.products )
            } );

Запрос идет на нужный url ? (Что в website.href ?)

this.$http.post( Website.href ).then(response => {
                this.products = response.body.products;
                console.log( response.body.products )
            },response => {
                console.error(response)
            }
 );

добавьте вторую функцию для обработки случая с ошибкой