watch异步操作
异步操作:
1.ajax,
2.定时器
3.点击事件
4.数据库操作
特点:代码不等待,后续代码会继续执行。
watch:{
//watch作用监测已经存在的数据 newVal 新值,oldVal 旧值
searchName(newVal,oldVal){
axios.get("http://localhost:3001/brands?name_like="+newVal).then((res) => {
const { status, data } = res;
if (status === 200) {
this.list = data;
}
});
}
},
======================全部代码-如果不是异步操作数据库也可以通过集合中的filter进行过滤搜索=====================================
"HelloWorld">class="add"> 品牌名称: "text" v-model="itemName" /> "button" @click="addItem" value="添加" />class="add"> 品牌名称: "text" placeholder="请输入搜索条件" v-model="searchName" />class="tb">
编号 品牌名称 创立时间 操作 for="(v, i) in list"> {{ v.id }} {{ v.name }} {{ v.date | timeFormat }} "#" @click.prevent="deleItem(v.id)">删除 if="list.length === 0" colspan="4">没有品牌数据