vue用新添加的属性的问题

问题：总有一个报错，指的是一个未声明的变量

这个属性是新建的，用来记录客户购买的数量，先引入全局vue，在用全局vue.set（）方法添加属性
html

<div class="num" v-show="food.count>0" >{{ count }}</div>

js：

add(event) {// 增加数量
        if(!event._constructed){// 阻止pc端点击后执行两次
          return;
        }
        if (!this.food.count) {
          Vue.set(this.food,"count",1)
        } else {
          this.food.count++;
        }
      }

vue.set(对象，属性，初始化)
属性创建没问题，但是dom结构中需要这个count来判断列表是否渲染，而这个创建属性的方法是绑定在用户点击的按钮上，所以一开始数据里是没有这个属性的，会报错
解决方法：

export default{
    data() {
      return {
        count: 0
      }
    }，
    methods：{
      add(event) {// 增加数量
        if(!event._constructed){// 阻止pc端点击后执行两次
          return;
        }
        if (!this.food.count) {
          Vue.set(this.food,"count",1)
          this.count = this.food.count;
        } else {
          this.food.count++;
          this.count =this.food.count;
        }
      }
    }   
}

在data里新建一个属性，用来初始化