Vue修改数据页面不更新的原因和解决方案

vue2是通过Object.defineProperty来实现数据响应式 ，因此在vue中写在data中的属性是可以转换成getter和setter，换句话说就是响应式的，其他定义在data之外的数据，是无法响应的渲染，意思就是改变数据 页面也不会刷新，所以一切要渲染到页面上的数据，必须写在data中.

列举几个不刷新的实例：
修改对象的某一属性
vue只会将已经在data中声明的属性变为响应，没有声明的是不响应的

<template>
  <div>
      <div v-for='item in list' :key="item">{
   {
   item}}</div>
      <button @click='click'>改变</button>
      <button @click='hadelClick'>解决方法</button>
  </div>
</template>
<script>
  export default({
   
    data(){
   
      return{
   
        list:{
   a:'a',b:'b'},
      }
    },
    methods: {
   
          click() {
   
          //  未声明不触发渲染
           this.list.c='c'

          },
          hadelClick