今天主要学习vue的一些原理,尤其是vueComponent与Vue的关系,个人觉得值得反复回味,很巧妙

本文探讨了VueComponent与Vue实例之间的内在联系,详细解释了Vue的生命周期函数,强调了在不同阶段执行的操作。此外,还介绍了组件化编程的概念,包括组件的创建、注册和使用。特别关注了VueComponent的实例对象(vc)和Vue实例对象(vm)的区别,并分析了单文件组件和非单文件组件的差异。文章还涵盖了Vue项目的结构,如脚手架中的文件,以及如何利用ref属性、props方法、mixin混入以及Vue插件来增强功能。
摘要由CSDN通过智能技术生成
生命周期函数(四对,创建、挂载、更新、销毁)
  1. 生命周期函数名字不可更改,逻辑可自己填写。它的this指向vm或组件对象实例

  2. mounted:与methods和data平级,Vue完成模板的解析并把初始的真实DOM元素放入页面后调用mounted

  3. 常用的生命周期钩子:

    • mounted: 发送ajax请求、启动定时器、绑定自定义事件、订阅消息等初始化操作。
    • beforeDestroy: 清除定时器、解绑自定义事件、取消订阅消息等收尾工作。

    关于销毁Vue实例:

    1. 销毁后借助Vue开发者工具看不到任何信息。
    2. 销毁后自定义事件会失效,但原生DOM事件依然有效。
    3. 一般不会在beforeDestroy操作数据,因为即便操作数据,也不会再触发更新流程了。

组件化编程

组件:实现应用中局部功能代码和资源的集合

使用组件:创建组件:const 组件名 = Vue.extend({配置里面不可以写el;data必须写成函数}), 可简写为:const school = options——在components里注册 或 全局注册组件:Vue.component(‘name’,{配置})——引入组件标签

组件中的data写成函数式,return{} (使用多次)每次使用的时候返回的都是一个全新的内容,修改不影响其他

组件嵌套:组件在谁里面定义的就要在哪个里面去使用


VueComp
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值