基本指令
v-clock解决闪烁
背后的原理:先通过样式隐藏内容,然后在内存中进行值的替换,替换好之后再显示最终的结果
v-text
v-model
事件:v-on:click @click
$event 事件对象
常用特性
表单操作
设置value 绑定 通过js提交
表单修饰符:
number:转化为数值
trim:去掉开始和结尾的空格
lazy:将input事件切换为change事件
1 | <input v-model.number="age"type="number"> |
自定义指令
计算属性
计算属性与方法的区别:
计算属性是基于它们的依赖进行缓存的
方法不存在缓存
Computed 内的方法
过滤器
过滤器的作用是什么?
格式化数据,比如将字符串格式化为首字母大写,将日期格式化为指定的格式等
侦听器
应用场景:数据变化时执行异步或开销较大的操作
生命周期
组件化开发
注册组件
:data是一个函数
如果使用驼峰式命名组件,那么在使用组件的时候,只能在字符串模板中用驼峰的方式使用组件,但是在普通的标签模板中,必须使用短横线的方式使用组件
值传递
props属性值类型
字符串 String
数值 Number
布尔值 Boolean
数组 Array
对象 Objects
事件定义传递信息
非父子组件间传递
插槽slot
ps:必须写在子标签内
位于字组件的模板中
template 包裹多条
作用域插槽
父组件对子组件加工处理 父组件定义样式
前后端交互
异步请求
axiox
async/await
路由
component Vue自定义的,就是用于组件占位
基本使用
重定向
嵌套路由
动态路由匹配
$route与对应路由形成高度耦合,不够灵活,所以可以使用props将组件和路由解耦
当props为对象参数时,:id 无法被访问
动态静态参数结合
命名路由
编程式导航
前端工程化
模块化规范
webpack
基本使用
)
loader加载器
use数组中指定的1oader顺序是固定的
多个1oader的调用顺序是:从后往前调用