Vue组件手表

时间:2018-03-01 09:34:03

标签: javascript vue.js vue-component

我如何看待数据中组件的变化? 当用户从该品牌的服务器型号中选择汽车品牌时,我需要观察 这是我的代码 Templete

<template>
<div class="category-info">
    <div v-for="input in inputs.text">
        <label >{{ input.placeholder}}</label>
        <input type="text"  id="location" :name="input.name" v-model="input.value" @click="console">
    </div>
    <div class="select" v-for="select in inputs.select">
        <label >{{ select.placeholder }}</label>
        <my-select :data="select" v-model="select.value"></my-select>
    </div>
    <button @click="console">click</button>
</div>

脚本

<script>
export default {
    name: "profile-add-inputs",
    props: ['category'],
    data() {
        return {
            inputs: {
                text : {},
                select: {}
            },
        }
    },
    methods: {
       getCategories(){
           axios.get('/profile/inputs', {
               params: {
                   category: JSON.stringify(this.category.href)
                }
               })
                .then((response) => {
                   this.inputs.text = response.data.text;
                    this.inputs.select = response.data.select;
                    for(let key in this.inputs.text){
                        this.inputs.text[key].value = '';
                    }
                    for(let key in this.inputs.select){
                        this.inputs.select[key].value = '';
                        if(this.category.href.sub == 'car' && this.inputs.select[key].name == 'brand'){
                            console.log('CAR BREND');
                            this.$watch.inputs.select[key].value = function () {
                                console.log(this.inputs.select[key].value);
                            }
                        }
                    }
                },this)
                .catch(function (error) {
                    console.log(error);
                });
       },
        console(){
            console.log(this.inputs.select);
        }
    },
    watch: {
        category : function () {
            this.getCategories();
            console.log('categoty');
        },
        inputs : {
            handler() {
                console.log('watch inputs');
            }
        }
    }
}

所以,我试图使用手表和手表,但它不起作用,PLZ给我一个原因,为什么这不起作用,或者可能是另一种方式来解决这个问题

这个。$ watch我可以用这个肛门创建动态观察者吗?

1 个答案:

答案 0 :(得分:0)

正确的语法是

watch : {
  inputs : function(val, oldVal){
     //val : New value
     //oldVal : Previous value.
  }
}