1、v-model表单修饰符
.lazy修饰符
<input type="text" v-model.lazy="mytext" />
//js
data: {
mytext: ""
}
.lazy修饰符的作用就像懒加载，它限制了v-model勤快的双向数据绑定，实时更新，从而让表单元素在最后一次失去焦点的时候更新一下，节约浏览器的资源。
.number修饰符
<input type="text" v-model.number="mynumber" />
//js
data: {
mytext: "",
mynumber: 0,
}
.number修饰符是监测变单元素输入的内容是否为数字，如果监测到含有不是数字出现的时候，就会失去v-model双向绑定的实时显示功能。
.trim修饰符
<input type="text" v-model.trim="myusername" />
//js
data: {
mytext: "",
mynumber: 0,
myusername: ""
}
.trim修饰符的作用是监测表单元素中用户输入的数据汇中是否有空格存在，如果有空格存在，则将空格自动去除掉。
2、vue的异步请求的fetch
因为XMLHttpRequest是一个设计粗糙的API，配置和调用方式非常的混乱，且基于时间的异步模型写起来不友好，兼容性也是不好。
//基本语法
fetch("url请求地址").then(res=>res.json).then(res=>{
console.log(res);
})
在vue中使用fetch数据请求方式。
fetch("./hh.json").then(res=>{
return res.json();
}).then(res=>{
console.log(res)
})
上面就是fetch的请求数据的使用方法，类似于promise和axios，但是他们又有区别，感兴趣的可以自己去查阅一下他们的之间的相关性和区别性。
3、vue的异步请求的利器axios-get请求
axios是基于promise对Ajax的封装，是异步请求的一种解决方案。前端的mvvm架构，对于使用$ajax使用起来就不是那么友好了，而且原生的Ajax，用起来又十分的麻烦，所以axios就应运而生了，并被大多数人所认可。下面是axios的简单案例，尝试使用。
//1.先准备一个本地的json文件，写入json数据，这一步是伪造请求地址。
{
"status": 1111,
"data": {
{
//数据1
},
{
//数据2
},
{
//数据3
}
}
}
//2.js中使用axios进行数据请求，先引入axios这个库，然后写入请求代码
axios.get("json数据请求url").then(res=>{
console.log("请求成功啦，执行的地方！");
console.log(res.data);//axios自动包装data属性，需要res.data才可以取到数据
}).catch(err=>{
console.log("请求失败才会来到的地方！");
console.log(err);
})
//3.可以将请求回来的数据赋值给自己定义的变量，然后这个变量在HTML中的li
//进行遍历显示需要的请求回来的数据内容
let vm = new Vue({
el: "#main",
data: {
datalist: []
}，
methods: {
handleoninfo(){
//在这里进行axios数据的请求，相当于定义了一个事件，当点击按钮就
//会触发数据请求
axios.get('url请求地址').then(res=>{
//这里是then中请求成功地回调函数内容
return res.data;
//res是请求成功后返回的数据，但是axios将json中真实的数据保存在
//自己分装袋data属性中，所以需要res.data中取出json中我们想要的数据。
}).catch(err=>{
console.log(err);
//这里是请求失败的回调函数，err变量中存储的就是错误的信息，可以
//打印出来查询
})
}
}
})
//htnl
<input type="button" @click="handleoninfo()" />
<ul>
<li v-for="item in datalist">
{{item.info.name}}
//显示请求回来的数据中的info变量中的name属性值
</li>
</ul>
