ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

vue基础2

2022-07-22 19:35:29  阅读:119  来源: 互联网

标签:vue 基础 sync 销毁 阶段 组件 model 页面


vue生命周期

1.初始化阶段 两个钩子函数 beforecreated和created,bc是数据还没有的时候,created是数据已经有了,此时我们多用于ajax请求页面挂载所需要的数据
2.挂载阶段 beforemounted和mounted,bm是页面元素还没有创建的时候,mounted是页面元素已经创建,此时常用于ref获取dom元素
3.更新阶段 beforeupdated和updated,bu是数据更新了,但是页面还没有渲染出来,updated是更新页面结束
4.销毁阶段 beforedestory和destoryed,bd是组件销毁前,常用于清除定时器等等的前置工作,让组件销毁后不再对程序造成影响。 destoryed是销毁之后
如果使用keepalive的话,初始化阶段和挂载阶段只会执行一次,销毁阶段不会执行,且诞生出其他两个钩子函数,激活状态activated和失活状态deactivated

父子组件生命周期执行顺序

前两个阶段是父bc,c,bm,子bc,c,bm,m,父m,后两个阶段都是父bu(bd),子bu(bd) u(d),父u(d)

v-if和v-show

v-if是组件的销毁与创建
v-show是样式的隐藏
如果组件需要频繁的触发效果的话,使用v-show更好一些

sync和v-model的区别

sync和v-model都可以实现双向绑定,不同点是v-model一个组件或者标签上只可以使用一次,但是sync可以使用多次。原理方面的话,v-model是使用input事件绑定视图和数据,而sync
是使用update事件。

$router和$route的区别

router多用于路径切换,路由跳转,而route可以访问到路由的一些信息,比如params query meta等等

vuex的理解

vuex是vue的状态管理,用于组件通信,包含state(类似于组件中的data,存放数据),getters(计算属性),mutations(同步函数,组件通过commit触发),actions(异步函数,组件通过dispatch触发)
modules(模块化写法,将vuex中代码分模块编写,比如user,login等等,可以使用namespaced开启私有空间,但之后再组件中触发同步或者异步任务需要再函数名前加上模块名)

组件通信

父向子传值可以使用props,子向父传值使用this$emit, 其余父子间传值还有v-model sync(vue3没有)$children $parent 跨组件传值有vuex,eventbus,

标签:vue,基础,sync,销毁,阶段,组件,model,页面
来源: https://www.cnblogs.com/biubiushen/p/16507316.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有