vue的created和mounted使用
时间: 2023-08-20 17:11:20 浏览: 49
Vue的created和mounted是Vue生命周期钩子函数,用于在Vue实例的不同阶段执行特定的操作。
created()函数在Vue实例被创建之后立即执行。在这个阶段,Vue实例的数据观测和事件配置已完成,但尚未挂载到DOM上。通常在这个阶段执行一些数据初始化、事件监听、异步请求等逻辑,但不涉及DOM操作。\[3\]
mounted()函数在Vue实例被成功创建和挂载到DOM后执行。在这个阶段,Vue实例已经和DOM元素建立了关联,可以进行DOM操作和访问DOM元素。通常在这个阶段执行一些需要操作DOM的逻辑,比如初始化第三方插件、绑定事件监听器等。\[1\]
需要注意的是,created()和mounted()只有在Vue实例被成功创建和挂载后才会执行。如果在创建或挂载过程中发生错误或中止,这两个函数也不会执行。在使用这两个函数时,要避免过多的依赖全局状态或其他模块,以保证逻辑的灵活性和可重用性。\[2\]
#### 引用[.reference_title]
- *1* [vue中created和mounted含义与用法](https://blog.csdn.net/xu2034029667/article/details/117187688)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control,239^v3^insert_chatgpt"}} ] [.reference_item]
- *2* *3* [created()和mounted()的区别及其用法](https://blog.csdn.net/qq_52675745/article/details/130964906)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)