资讯专栏INFORMATION COLUMN

vue知识点总结

mdluo / 2855人阅读

摘要:知识点的生命周期生命周期钩子描述在实例初始化前,数据观测和事件配置之前被调用实例被创建完成后调用。在这一步,实例已经完成以下配置数据观测,属性和方法的运算,事件的回调。

vue知识点 1.vue的生命周期
生命周期钩子 描述
beforeCreate 在实例初始化前,数据观测和event/watcher事件配置之前被调用
created 实例被创建完成后调用。在这一步,实例已经完成以下配置:数据观测,属性和方法的运算,watcher/event事件的回调。挂载阶段还没开始,$el属性不可见
beforeMount 在挂载之前调用,相关的render首次被调用
mounted el被新创建的vm.$el替换,并挂载到实例上去之后调用该钩子。如果root实例挂载了一个文档内元素,当mounted被调用时vm.el也在文档内
beforeUpdate 数据更新时调用,发生在虚拟dom重新渲染和打补丁之前。你可以在这个钩子中进一步更改状态,不会触发重渲染过程
updated 由于数据更改导致的虚拟 DOM 重新渲染和打补丁,在这之后会调用该钩子。当这个钩子被调用时,组件 DOM 已经更新,所以你现在可以执行依赖于 DOM 的操作。
activated keep-alive 组件激活时调用。
deactivated keep-alive 组件停用时调用。
beforeDestroy 实例销毁之前调用。在这一步,实例仍然完全可用。
destroyed Vue 实例销毁后调用。调用后,Vue 实例指示的所有东西都会解绑定,所有的事件监听器会被移除,所有的子实例也会被销毁。
2.keep-alive

它是vue的内置组件,能在组件切换过程中将状态保存在内存中,防止重复渲染dom

3.vue中的指令

v-if指令

条件渲染指令,根据表达式真假来删除和插入元素

v-show指令

与v-if的区别,不管条件成立与否,v-show都会渲染html,v-if只有为true才会渲染

v-eles指令

与v-if或v-show同时使用,v-if条件不成立就会显示v-else

v-for指令

基于一个数组渲染一个列表,与js的遍历相似

v-bind指令

动态绑定一个或者多个特性,可简写为:class(原v-bind:class)

v-on指令

用来监听dom事件,用法和v-bind类似

4.组件通信

父子组件通信主要是通过props和自定义事件,父组件通过props给子组件下发数据,子组件通过事件给父组件发出消息

5.双向数据绑定原理

vue内部通过object.defineProperty方法属性拦截的方式,把data对象的每个数据读写转化为getter/setter,当数据变化通知视图更新。

6.vue是什么

vue是一个构建数据驱动的web界面的渐进式框架

7.vue修饰符

.lazy

在默认情况下,v-model 在每次 input 事件触发后将输入框的值与数据进行同步 。你可以添加 lazy 修饰符,从而转变为使用 change 事件进行同步:

.number(v-model)

将输入的输入值自动转化为数值类型

.trim(v-model)

过滤用户输入的首尾空白字符

事件修饰符





...
...

未完待续~~~~

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/109999.html

相关文章

  • Java学习路线总结,搬砖工逆袭Java架构师(全网最强)

    摘要:哪吒社区技能树打卡打卡贴函数式接口简介领域优质创作者哪吒公众号作者架构师奋斗者扫描主页左侧二维码,加入群聊,一起学习一起进步欢迎点赞收藏留言前情提要无意间听到领导们的谈话,现在公司的现状是码农太多,但能独立带队的人太少,简而言之,不缺干 ? 哪吒社区Java技能树打卡 【打卡贴 day2...

    Scorpion 评论0 收藏0
  • 基于vue项目的知识总结

    摘要:前言用有一段时间了,从用搭建项目一步步配置,到之后的研究动效这些,一直想写些东西记录一下做个总结,刚好趁着有空就整理一下。结语有新的知识点会更新到知识体系中,总结和心得体会会单独写文章详述,努力填坑 前言 用vue有一段时间了,从用vue-cli搭建项目、一步步配置axios、vuex、vue-router,到之后的研究canvas、动效这些,一直想写些东西记录一下、做个总结,刚好趁着...

    tianlai 评论0 收藏0
  • vue常用识点总结

    摘要:这里借鉴了一下的处理方式,我们把单独模块的包装成一个函数,提供一个全局的回调方法,加载完成时候再调用回调函数。 感谢本文引用链接的各位大佬们,小菜鸟我只是个搬运工 1.谈一谈你理解的vue是什么样子的? vue是数据、视图分离的一个框架,让数据与视图间不会发生直接联系。MVVM 组件化:把整体拆分为各个可以复用的个体 数据驱动:通过数据变化直接影响bom展示,避免dom操作。 可以在...

    xiaokai 评论0 收藏0
  • 前端最实用书签(持续更新)

    摘要:前言一直混迹社区突然发现自己收藏了不少好文但是管理起来有点混乱所以将前端主流技术做了一个书签整理不求最多最全但求最实用。 前言 一直混迹社区,突然发现自己收藏了不少好文但是管理起来有点混乱; 所以将前端主流技术做了一个书签整理,不求最多最全,但求最实用。 书签源码 书签导入浏览器效果截图showImg(https://segmentfault.com/img/bVbg41b?w=107...

    sshe 评论0 收藏0

发表评论

0条评论

mdluo

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<