[Vue warn]: Error in callback for watcher "items" ? 應(yīng)該是你監(jiān)聽(tīng) items的時(shí)候有問(wèn)題，你已經(jīng)解決了我就不細(xì)看了

請(qǐng)問(wèn)你找到解決方法了沒(méi)有，我也和你出現(xiàn)了同樣的錯(cuò)誤

<template>
??<div?id="app">
????<h1?v-text="title"></h1>
????<ul>
??????<input?v-model="newItem"?@keyup.enter="addNew"></input>
??????<li?v-for="item?in?items"?v-bind:class="{finished:?item.isFinished}"?v-on:click="toggleFinish(item)">
????????{{item.label}}
??????</li>
????</ul>
??</div>
</template>

<script>
??import?Store?from?'./store'
??export?default?{
????name:?'app',
????data?()?{
??????return?{
????????title:?'This?is?a?Todo?List',
????????items:?Store.fetch(),
????????newItem:?''
??????}
????},
????watch:?{
????????msg:{},
????????items:?{
???????????handler:?function?(items){
????????????Store.save(items)
??????????},
??????????deep:?true
????????}
????},
????methods:?{
??????toggleFinish:?function?(item)?{
????????console.log(item.isFinished=!item.isFinished)
??????},
??????addNew:?function(){
????????console.log(this.newItem)
????????this.items.push({
???????????label:this.newItem,
????????????isFinished:?false
????????})
????????this.newItem=''
??????}
????}
}
</script>

<style>
??.finished{
??text-decoration:?underline;
}
??#app?{
??font-family:?'Avenir',?Helvetica,?Arial,?sans-serif;
??-webkit-font-smoothing:?antialiased;
??-moz-osx-font-smoothing:?grayscale;
??text-align:?center;
??color:?#2c3e50;
??margin-top:?60px;
??}
</style>

我用的是 vue 新版本

Hello.vue
<template>
??<div?class="hello">
????<!--?{{}}?是?v-text=""的一個(gè)簡(jiǎn)寫方式?-->
????<h1>{{?msg?}}</h1>
????<!--?v-bind:class?簡(jiǎn)寫:class="[XXX]"?也能取值-->
????<p?:class="[pClass]">{{pClass}}</p>
????<input?v-model="newItem"?v-on:keyup.enter="addNew">
????<ul>
??????<!--?v-for?用法?-->
??????<li?v-for="item?in?items"?v-bind:class="{finished:?item.isFinished}"?v-on:click="toggleFinish(item)">
????????{{item.label}}
??????</li>
????</ul>
????<h2>Essential?Links</h2>
????<ul>
??????<li><a?>Core?Docs</a></li>
??????<li><a?>Forum</a></li>
??????<li><a?>Gitter?Chat</a></li>
??????<li><a?>Twitter</a></li>
??????<br>
??????<li><a?>Docs?for?This?Template</a></li>
????</ul>
????<h2>Ecosystem</h2>
????<ul>
??????<li><a?>vue-router</a></li>
??????<li><a?>vuex</a></li>
??????<li><a?>vue-loader</a></li>
??????<li><a?>awesome-vue</a></li>
????</ul>
??</div>
</template>

<script>
import?Store?from?'../store'
export?default?{
??name:?'hello',
//?function?data(){
//???return??{
//???????msg:?'Welcome?to?Your?Vue.js?App'
//?????}
//?}
??data?()?{
????return?{
??????msg:?'Welcome?to?Your?Vue.js?App',
??????//?返回一個(gè)數(shù)組
??????items:?[
????????//?{
????????//???label:?'coding',
????????//???isFinished:?false
????????//?},
????????//?{
????????//???label:?'walking',
????????//???isFinished:?true
????????//?}
??????],
??????pClass:?'myP',
??????newItem:?''
????}
??},
??watch:?{
????msg:?{},
????items:?{
???????handler:?function(val,oldVal){
????????Store.save(val);
????????console.log(Store);
??????},
??????deep:true?//深層復(fù)制
????}
????//?items:?{
????//?????//?handler:?function(val,oldVal){
????//?????//?????console.log(JSON.stringify(val)+"??"+JSON.stringify(oldVal));
????//?????//?}
????//???handler:?function(val,oldVal){
????//?????Store.save(val);
????//?????console.log(Store);
????//???},
????//???deep:true?//深層復(fù)制
????//?}
??},
??//?方法一定要寫在這里
??methods:{
????toggleFinish:?function(item){
??????item.isFinished=!item.isFinished;
??????//console.log(item);
????},
????addNew:?function(){
??????//console.log(this.newItem);
??????this.items.push({
????????label:?this.newItem,
????????isFinished:?false
??????});
??????this.newItem='';
????}
??}
}
</script>

<!--?Add?"scoped"?attribute?to?limit?CSS?to?this?component?only?-->
<style?scoped>
.myP{
??text-decoration:?underline;
}

.finished{
??text-decoration:?underline;
}

h1,?h2?{
??font-weight:?normal;
}

ul?{
??list-style-type:?none;
??padding:?0;
}

li?{
??display:?inline-block;
??margin:?0?10px;
}

a?{
??color:?#42b983;
}
</style>

app.vue
<template>
??<div?id="app">
????<img?src="./assets/logo.png">
????<hello></hello>????
??</div>
</template>

<script>
//?import?是?es6?的語(yǔ)法
import?Hello?from?'./components/Hello'
//?類似?module.export?=?{?}
//?export?項(xiàng)目會(huì)自動(dòng)生成?new?Vue({})
export?default?{
??name:?'app',
??components:?{
????Hello
??}
}
</script>

<style>
#app?{
??font-family:?'Avenir',?Helvetica,?Arial,?sans-serif;
??-webkit-font-smoothing:?antialiased;
??-moz-osx-font-smoothing:?grayscale;
??text-align:?center;
??color:?#2c3e50;
??margin-top:?60px;
}
</style>