vue中什么是created钩子函数,以及使用场景

文章详细介绍了Vue的created生命周期钩子,其用于实例创建后进行数据初始化、网络请求、事件订阅等操作。created尤其适合发起异步请求和初始化全局变量,是组件初始化的重要步骤。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

    在Vue中,created是一个生命周期钩子函数,用于在Vue实例被创建后立即被调用。它是Vue实例的一个重要阶段,在此阶段可以进行一些初始化工作和数据处理。

created的主要作用如下:
1. 初始化数据:可以在created阶段初始化data中的数据,为后续的操作做准备。例子:比如调用现在的事实日期,在不使用created时:

我们发现打开网页没有日期,当使用created函数时:

打开网页就可以实时获取日期了。


2. 发送网络请求:在created阶段可以发送异步请求获取数据,并将获取到的数据保存到data中,以供组件中使用。(在使用场景里面有实例)
3. 进行订阅和监听:可以在created阶段进行事件的订阅和监听,例如监听window对象的resize事件或者订阅其他组件的事件。
4. 注册事件:可以在created阶段注册自定义事件,以便在组件内部进行触发和响应。
5. 进行计算属性的初始化:可以在created阶段对计算属性进行初始化,例如根据data中的数据计算出一些衍生的属性。

使用场景:
1. 发起异步请求并处理返回数据:在created钩子中可以使用Vue-resource、Axios等插件发送异步请求,获取服务器返回的数据,并对数据进行处理和渲染,以通过axios调用接口实例如下:

我们会发现当created换成onShow时,在页面中就没有发起异步请求,由于这两个页面都是组件,跳转的时候页面没有刷新,总体还是一个页面所以无法触发onShow事件,但是如果使用created的话当this.BillList() 实例创建并将获取到的数据保存到data中,以供组件中使用。


2. 初始化全局变量或状态:在created钩子中可以初始化Vuex中的state,或者初始化一些全局变量,以便后续的操作和使用。
3. 订阅全局事件或监听窗口事件:在created钩子中可以订阅全局事件,用于组件之间的通信或监听窗口的resize等事件。
4. 初始化第三方插件:在created钩子中可以初始化一些需要在组件中使用的第三方插件,例如地图插件、轮播图插件等。

总结:created是Vue实例创建后的一个重要阶段,在该阶段可以进行数据初始化、网络请求、事件订阅等操作,适用于各种场景,对于组件的初始化和数据准备非常有用,嗯目前我只理解了前两个因为调用接口需要axios和初始化请求,后续遇到更多的事件也会持续的更新。。。。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值