属性Vue.js

Question

我有一个properties组件，其中包含一些输入道具

props: ['activeObjectProps', 'canvas', 'fonts']

我需要观看activeObjectProps的更改，所以这里是wathcer

watch: {
    'activeObjectProps': {
        handler: function (newProps) {
            console.log('watch triggered');
        },
        deep: true
     }
}

模板中的

我有以下v-for循环：

<div class="col-xs-4 center-xs" v-for="font in fonts" @click="setFont(font)" :style="{fontFamily: font}">
    {{font}}
</div>

最后是setFont方法

methods: {
        setFont: function (font) {
            //this.editFontModal.close();
            this.$set(this.activeObjectProps, 'fontFamily', font);
        }
    }

如果我理解正确，我应该调用$set函数来设置此反应参数，但这不起作用。如果我点击某些字体，则不会触发handler功能。当然，如果我只是this.activeObjectProps.fontFamily = font - 它也不起作用。你能给我一个建议吗，我做错了什么？