VUE初始化获取数据应该放到Created还是Mounted中？

最新推荐文章于 2024-08-02 17:51:05 发布

于鱼鱼鱼

最新推荐文章于 2024-08-02 17:51:05 发布

阅读量537

点赞数

文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/m0_46234959/article/details/126099252

版权

首先，获取后端初始化最后达到的效果是相同的，但是，他们之间实现的过程是有区别的

使用mounted的时候，显示的数据时页面渲染完成后，页面的响应式效果将数据显示在页面中

使用created是获取到数据再渲染到页面中。

但是，既然实现的过程有区别，为什么效果没有区别呢？

这是因为，我们在获取数据的时候，一般都是使用ajax或者axios请求，这些请求是异步的，JS语言是单线程机制语言，按照他的执行顺序，先执行宏任务再执行微任务，异步是最后执行的，所以，在获取数据的时候，ajax和axios都是最后执行的，最后达到的效果相同

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

于鱼鱼鱼

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
VUE初始化获取数据应该放到Created还是Mounted中？

VUE初始化获取数据应该放到Created还是Mounted中？
复制链接

扫一扫

谈一谈vue请求数据放在created好还是mounted里好

11-20

关于“Vue请求数据放在`created`好还是`mounted`里好”的问题，主要涉及到Vue组件生命周期的理解以及页面渲染优化。首先，`created`钩子在模板渲染成HTML之前被调用，适合用来初始化组件的数据和进行一些非DOM相关...

在vue中created、mounted等方法使用小结

10-15

在这个阶段，你可以进行数据初始化、异步数据获取或者设置监听器等操作。由于DOM尚未生成，所以无法直接访问或操作DOM元素。 2. **`mounted`**： - `mounted`钩子在实例被创建并且其对应的DOM元素已经被插入到文档...

参与评论您还未登录，请先登录后发表或查看评论

Vue生命周期详解

热门推荐

写代码的渣渣苏

03-24

3万+

Vue生命周期详解

Vue 初始化获取数据应该放到 Created 还是 Mounted 中？

学习记录总结分享

11-21

3193

比如说你需要用到dom操作：使用echarts时，如果你将数据获取放在了created的话，它会有出现无数据的情况（有时候确实又有数据），那时由于在用echarts钩子的时候,需要用ref获取dom元素，在dom初始化之前调用ref是无法获取到的。按理来说，用created和mounted获取后端初始化数据能达到的效果是一致的，只不过使用mounted时，显示的数据有可能是页面渲染完成后，页面的响应式效果将数据显示在页面中；Vue 初始化获取数据应该放到 Created 还是 Mounted 中？

Vue请求初始化数据放在Created还是Mounted？

南北极之间

11-29

3385

一般来说，可以在，created，mounted中都可以发送数据请求，但是，大部分时候，会在created发送请求。资料：超详细vue生命周期解析(详解)深入理解_勤动手多动脑少说多做厚积薄发-CSDN博客代码：<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initi

axios之Vue请求初始化数据放在Created还是Mounted？

weixin_42776027的博客

05-20

2802

先分析下生命周期 beforecreated：el 和 data 并未初始化 created:完成了 data 数据的初始化，el没有 beforeMount：完成了 el 和 data 初始化 mounted ：完成挂载（1）mounted 　　很多人跟我说初始化放在Mounted里面，我问她(他)们为什么？她(他)们回答说因为这个时候DOM初始化渲染好啦。然后我继续问DOM初始化渲染和请求初始化数据有什么关系？他们会说可以显示请求出来的数据啦。（大家觉得有冲突吗？） DOM初始.

在Vue中，请求数据是在created中还是在mounted中？

m0_58623036的博客

10-27

418

另外需要补充一点，也是官方文档上给大家提的一个醒，就是mounted阶段不保证所有的子组件也都被挂载完成，这时候如果我们希望等到整个视图都渲染完毕再做操作，那就需要使用到this.$nextTick方法。回归问题，在实际开发中请求不论放在created还是mounted大多时候是没有区别的，因为created和mounted都是同步的，而请求是异步的，不会堵塞页面渲染的主线程，我们也不能控制请求回来的时间。mounted:中文意思挂载完成，这时候初始化页面完成，此时页面已经渲染出来了，可以进行dom操作。

vue 加载时掉用mounted_Vue请求初始化数据放在Created还是Mounted？

weixin_39782832的博客

12-19

1507

1，首先我们看下官网对created和mounted这个2个生命周期怎么定义的：created：(在实例创建完成后被立即调用。在这一步，实例已完成以下的配置：数据观测 (data observer)，属性和方法的运算，watch/event 事件回调。然而，挂载阶段还没开始，$el 属性目前不可见。---官方贴的)created.pngmounted：(el 被新创建的 vm.$el 替换，并挂载...

Vue在created异步请求数据,在mounted中获取不到

Misnice的博客

09-13

666

在created中异步请求数据，在mounted中获取不到数据。利用watch监听数据，然后再获取数据。

Vue created/mounted 异步获取不到data中的数据

Huisoul的博客

12-04

1万+

最近在开发时遇到了个小坑，在没详细了解Vue的生命周期前，总以为mounted函数一定会在created函数完成后执行，但实则不然。如果呈现在页面上的数据是静态的，比如说像下面这样数据是写死不变化的，那么mounted函数中的方法获取模型层中的这些值是能获取的↓ export default { data() { return { dataList: [1,2，3,4，5,6] }; }, 注意注意注意！但如果大家的模型层数据是从后台动态响应返回的，

Vue 获取初始化数据是放在created还是mounted

雄的博客

12-11

8453

官方文档：也就是说Vue实例中的data和methods已经使用了。但是还没有挂载到页面上。可以在created里面去后端获取数据。当进入mounted这个生命周期函数。此时页面已经渲染出来，可以进行dom操作。总而言之。created生命周期函数，可以去后端异步获取数据，并保存到data里面。 mounted的话，如果需要在页面上操作dom，就要在这个函数执行。但是注意 mounted...

Vue实例中生命周期created和mounted的区别详解

08-29

此时，数据观测（data observer）和事件监听器（event/watcher）尚未设置，但数据已经被初始化。这意味着在这个阶段，你可以访问到所有定义的数据属性，并且可以进行异步操作，如API请求。然而，此时组件的DOM还未...

vue 路由子组件created和mounted不起作用的解决方法

10-16

因此，对于那些依赖于`created`或`mounted`钩子的初始化操作，可能需要调整到其他合适的生命周期钩子，例如`activated`，这个钩子在组件被`keep-alive`缓存并重新激活时调用。最后，遇到类似问题时，查阅官方文档...

vue中created和mounted的区别浅析

12-10

- `created` 在实例创建之后被调用，但在此时，Vue实例的属性（如`data`）已经被初始化，`data` 的响应式系统已经设置完毕。 - 在 `created` 阶段，组件的模板还没有被编译成真实 DOM，因此无法访问到任何DOM元素...

详解Vue中nextTick的原理与作用

fengjing81的专栏

07-24

1026

Vue中的nextTick是一个非常重要的API，它允许开发者延迟回调函数的执行直到下次DOM更新循环之后。这一机制在Vue开发中非常有用，特别是在处理DOM更新和异步操作时。下面将详细解释nextTick的原理与作用。

Vue.extend、组件（component）、插件（plugin）和混入（mixin）以及工具函数（utils）的区别

qq_41910413的博客

08-02

314

Vue.extend、组件（component）、插件（plugin）和混入（mixin）以及工具函数（utils）的区别

VueRouter 相关信息