vue学习路线整理
2022-12-23 11:16:50 22 举报AI智能生成
登录查看完整内容
为你推荐
查看更多
主要记录学习Vue的学习路径
作者其他创作
大纲/内容
MVVM
moustache语法
data
methods
选项式
setup语法糖
ref
reactive一般用来定义引用数据类型
reactive、toRef、toRefs
setup
组合式
选项式&组合式
Vue基础语法
是根据依赖关系进行缓存的计算，只有在它的相关依赖发生改变时才会进行更新
computed
watch监听ref定义的变量
immediate
watch立即监听
watch
创建、引入、（注册）/使用、
组件基本使用
全局：AppNew.component(\"组件名\
全局组件与局部组件
type
required
default
props/defineProps
父传子
$emit/defineEmits
defineExpose
子传父
defineExpose/ref属性
provide/inject
祖传孙
pinia
兄弟组件
组件间通信
动态组件<component is=\"\"></component>
keep-alive
component
v-cloak
可以将string的html解析出来并且进行渲染
v-html
v-text
v-show
v-if
v-else
v-else-if
用于显示原本的Mustache语法
v-pre
v-once
遍历数组/对象
key的作用
v-for
动态添加属性
v-bind/语法糖:
事件调用的方法没有参数
参数
阻止冒泡
stop
阻止默认事件
prevent
监听键盘事件
keyCode|keyAlias
只会执行一次
once
修饰符
@click/@keyup
监听事件
v-on/语法糖@
可以将输入转换成Number类型.否则不管是否输入数字，其实都是String。
number
使用修饰符.lazy会转变为在change事件中同步.就是在失去焦点或者按回车才更新
lazy
自动过滤输入的首位空格
trim
双向数据绑定
v-model
指令与元素成功绑定时调用；
bind
指令所在元素被插入页面时调用；
inserted
指令所在模板结构被重新解析时调用。
update
directives
全局指令
局部指令
自定义指令
指令
beforeCreate
created
beforeMount
mounted
beforeUpdate
updated
beforeUnmount
unmount
deactivated
activated
keepAlive
生命周期钩子函数
slot
普通插槽
具名插槽
域名插槽
插槽slot
proxy.globalProperties.$xxx=xxx
全局属性
Vue.js
path
name
component:() => import(\"@/xxx/xxx.vue\")
懒加载
import Options from \"@/xxx/xxx.vue\";component:Options
预加载
路由配置
有#号
hash
无#号
history
路由模式
children
重定向
meta
路由元信息meta
<router-link></router-link><router-view><router-view>
路由基本使用
嵌套路由
<router-link to=\"{}\"></router-link><router-view></router-view>
声明式
有历史记录
proxy.$router.push()
无历史记录
proxy.$router.replace()
proxy.$router.go()
编程式
声明式路由和编程式路由
<router-link to=\"{path:\"xxx\
query
params
query和params
$router和$route的区别
router.beforeResolve
全局路由守卫
to即将要进入的目标
from当前导航正要离开的路由
前置路由守卫
后置路由守卫
独享路由守卫
beforeRouteEnter
beforeRouteUpdate
beforeRouteLeave
组件路由守卫
路由导航
router
$patch函数的形式修改状态数据
$patch对象的形式修改状态数据
$patch
定义公共变量
state
相当于component
getters
相当于methods
actions
pending进行中
then
resolve
fulfilled成功
catch
reject
rejected失败
状态
Promise
get
post
put/patch
delete
请求方式
传参
基本使用
函数封装
xxx.interceptors.request.use()
xxx.interceptors.response.use()
请求拦截、响应拦截
跨域
防抖与节流
axios
Element-plus
Vue
收藏
收藏
职业：暂无
0 条评论
回复 删除
下一页
