vue知识点总结
1.vue是渐进式的javaScript框架，其作者是尤雨溪是以为华裔前google工程师，是一个动态构建用户界面，个人理解为可以在一个界面中动态展示其中某一部分的数据显示，运行，转换等功能，相比于jsp,html页面有着不可替代的作用；
2.vue的特点：
vue遵循mvvm模式，编码整洁，体积小，运行效率高，适合移动和抛出端；
（1）vue扩展插件：
vue-cli:vue脚手架；
vue-router：路由主要是用于vue内部软件的路径跳转，在router文件包下写入相应的文件路径；
vuex:状态管理；
vue-lazyload:图片懒加载；
vue-scroller:页面滑动相关；
element-ui:基于vue的UI组件库（pc端）；
vue-axios是一个基于Promise用于浏览器和nodejs的http客户端，相当于与后端建立连接的一个中转器，具有拦截请求和相应以及自动转换成json数据。（ajax请求）
创建新的vue使用
vue init webpack 对象名称
json的转换
let c = json.stringify(pi);
let c = json.parse(pm);
vue的导入导出：
import 属性名 from router;
export default 方法名或。。。
vue中14版本为稳定版本，主要的运行机制是以下：
npm run dev //vue运行
npm run build //vue打包
vue中标签的属性的存在是props和v-bind;
vue中标签的事件的存在是methods和v-on；
vue中子标签的存在是slot;
resolve（xxx）等效于return “xxx”;
reject(xxxx)等效于throw “xxx”;
main.js主要是集成所有工具，集成axios,router,elementui等
vue中的router是存放项目文件的路径:
routes: [
{
name: 'login',
path: '/login',
component: () => import('@/npages/Login')
},
此为数据数据的限制条件:
οninput="value=value.replace(/[^\d|.]/g,'')" ?
οninput="value=value.replace(/[^\d]/g,'')"表示只能输入数字
在vue中的table-column小标签的隐藏与展示可以使用v-if标签，定义其中的某一个数据为何数，根据是否为该数实现标签的隐藏与展示 :
<el-table-column width="120px" align="left" header-align="center" label="备注" prop="notes" sortable>
</el-table-column>
字父组件之间的相互调用
在vue中通过子组件执行父组件的某一个方法可以使用如下方式：
this.$emit('row-click')
@RequestBody主要用来接收前端传递给后端的json字符串中的数据的(请求体中的数据的)；而最常用的使用请求体传参的无疑是POST请求了，所以使用@RequestBody接收数据时，一般都用POST方式进行提交。在后端的同一个接收方法里，@RequestBody与@RequestParam()可以同时使用，@RequestBody最多只能有一个，而@RequestParam()可以有多个。
注：一个请求，只有一个RequestBody；一个请求，可以有多个RequestParam。
注：当同时使用@RequestParam（）和@RequestBody时，@RequestParam（）指定的参数可以是普通元素、
数组、集合、对象等等(即:当，@RequestBody 与@RequestParam()可以同时使用时，原SpringMVC接收
参数的机制不变，只不过RequestBody 接收的是请求体里面的数据；而RequestParam接收的是key-value
里面的参数，所以它会被切面进行处理从而可以用普通元素、数组、集合、对象等接收)。
即：如果参数时放在请求体中，application/json传入后台的话，那么后台要用@RequestBody才能接收到；
如果不是放在请求体中的话，那么后台接收前台传过来的参数时，要用@RequestParam来接收，或在形参前 什么也不写也能接收。
注：如果参数前写了@RequestParam(xxx)，那么前端必须有对应的xxx名字才行(不管其是否有值，当然可以通过设置该注解的required属性来调节是否必须传)，如果没有xxx名的话，那么请求会出错，报400。
注：如果参数前不写@RequestParam(xxx)的话，那么就前端可以有可以没有对应的xxx名字才行，如果有xxx名的话，那么就会自动匹配；没有的话，请求也能正确发送。
追注：这里与feign消费服务时不同；feign消费服务时，如果参数前什么也不写，那么会被默认是@RequestBody的。
@RequestBody是通过无参构造器new的对象，然后通过set方法设置，如果在实体类中添加了有参构造器，没加无参构造器，接收参数时异常vue的前后端的数据传输一定要对应数据类型相同，后端传输的数据类型为List<…>前端的接收类型也必须一样
vue中数据类型转换：
parseInt()转为数字类型；toString()转为字符串类型
'== 和 '==='的区别
== 用来比较或者判断两者是否相等，比较时可以自动转换数据类型
=== 用来较为严格的比较，除判断数据2这是否相等 ，还会判断两者数据类型是否相同 如不相同也不会转换数据类型 。返回（false）
前端
data () {
return {
fileList: {
teacherId: '',
teacherName: '',
teacherClass: ''
}
}
},
mounted: function () {
axios.post('/select').then((response) => {
this.fileList = response.data
console.log(this.fileList)
})
},
后端
@RequestMapping(value = "/select")
@ResponseBody
public List<Teacher> findteacher(){
List<Teacher> teachers = service.getteacher();
return teachers;
}
vue通过axios进行前后端数据调用方法时使用的是get和post方法，前后端数据之间的交互主要传输的有两种类型：body和值
get方法：
function(){
axios.get('/select').then((response) => {
this.fileList = response.data
console.log(this.fileList)
})
}
post方法：
params:{
teachername:'',
teacherclass:''
}
this.params = $store.params;
function(){
axios.post('/select', params).then((response) => {
let data = response.data
console.log(this.data)
}
}
post方法传一个值和一个对象时
axios.post("/saveone?state="+ this.state,this.adRow)
.then(res => {
let data = res.data
console.log(this.data)
}
404和500状态码的区别
404是一种HTTP状态码，指网页或文件未找到，此信息代表客户端在浏览网页时，服务器无法正常提供信息，或是服务器无法回应且不知原因。
500，是一种HTTP状态码，指内部服务器错误，说明IIS服务器无法解析ASP代码，尝试去访问一个静态网页，如果静态页面也无法访问，说明解析还没生效。
定义时间显示
可以在entity实体类里面添加
@JsonFormat(timezone = "GMT+8", pattern = "yyyy-MM-dd HH:mm")
private Date endTime;//定义时间显示
VUE父子组件传值
父子组件的关系可以总结为 prop 向下传递，事件向上传递。父组件通过 prop 给子组件下发数据，子组件通过事件给父组件发送消息
vue中组件之间会产生通信，父组件传递给子组件的值，子组件可以通过props获取。子组件想要改变数据（vue中是禁止子组件直接向父组件传值的），只有通过触发事件的方式告诉父组件
父子组件传值时，父组件传递的参数，数组和对象，子组件接受之后可以直接进行修改，并且会传递给父组件相应的值也会修改。如果传递的值是字符串，直接修改会报错。不推荐子组件直接修改父组件中的参数，避免这个参数多个子组件引用，无法找到造成数据不正常的原因
this.$emit('方法名'，'数据');//子组件调用父组件的使用方法
