Vue watch监听不起做用

当前页面：home.vue <template>
　　<div>
　　　　<div class="chart-wrap">
　　　　<nodata v-if="tableNoData" class="newnodata"></nodata>
　　　　<jtable :tableData="tableData" :showColumns="showColumns" :storeDate="store_date" :isDetail='isDetail'></jtable>
　　　　</div>
　　<noNetwork v-if="noNetwork"></noNetwork>
　　</div>
</template>
 import nodata from 'src/components/modelNoData.vue'; import noNetwork from 'src/components/noNetwork.vue'; import table from 'src/components/table/table.vue'; export default { 　　components: { 　　　　table, 　　　　nodata, 　　　　noNetwork 　　}, 　　data() { 　　　　noNetwork: false, 　　　　tableNoData: false,
       tableData:[]

　　} }

 

组件：table.vue
 <template>
    <div class="table" id="table">
        <table border="1" borderColor="#e5e5e5" class="scrollTable">
                <!-- 表头 -->
                <thead :class="{'time_xi': tableData.columns[0].field == 'time_xi'}">
                </thead>
                <tbody>
                          <template v-for="(item,indexs) in tableData">
                                 <tr><td></td></tr>
                                 <div v-show='i==indexs' class='detailr' :style='{height:h+"rem"}'></div>
                          </template>
                </tbody>
        </table>
    </div>
</template>
 export default { props: ['tableData'], data() { return {  i: 'i', } },  watch: { //引用类型变量、采用深度监听  tableData: { // 表格数据刷新后需清空以前查看的订单详情内容 handler: function (newVal, oldVal) { this.i = 'i'; }, deep: true }, }}