Javascript Vue.js 中创建和挂载事件的区别
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/45813347/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Difference between the created and mounted events in Vue.js
提问by lesssugar
Vue.js documentation describes the createdand mountedevents as follows:
Vue.js 文档对created和mounted事件的描述如下：
created
Called synchronously after the instance is created. At this stage, the instance has finished processing the options which means the following have been set up: data observation, computed properties, methods, watch/event callbacks. However, the mounting phase has not been started, and the $el property will not be available yet.
创建实例后同步调用。在这个阶段，实例已经完成了对选项的处理，这意味着已经设置了以下内容：数据观察、计算属性、方法、观察/事件回调。但是，挂载阶段尚未开始，$el 属性尚不可用。
mounted
Called after the instance has just been mounted where el is replaced by the newly created vm.$el. If the root instance is mounted to an in-document element, vm.$el will also be in-document when mounted is called.
This hook is not called during server-side rendering.
在刚刚挂载实例后调用，其中 el 被新创建的 vm.$el 替换。如果根实例挂载到文档内元素，则调用 mount 时 vm.$el 也将在文档内。
在服务器端渲染期间不会调用此钩子。
I understand the theory, but I have 2 questionsregarding practice:
我理解理论，但我有两个关于实践的问题：
- Is there any case where
createdwould be used overmounted? - What can I use the
createdevent for, in real-life (real-code) situation?
- 是否有任何情况下
created会使用 overmounted？ created在现实生活（真实代码）情况下，我可以将事件用于什么？
回答by Vamsi Krishna
created(): since the processing of the options is finished you have access to reactive dataproperties and change them if you want. At this stage DOM has not been mounted or added yet. So you cannot do any DOM manipulation here
created()：由于选项的处理已完成，您可以访问反应性data属性并根据需要更改它们。在这个阶段，DOM 还没有被挂载或添加。所以你不能在这里做任何 DOM 操作
mounted(): called after the DOM has been mounted or rendered. Here you have access to the DOM elements and DOM manipulation can be performed for example get the innerHTML:
mounted(): 在 DOM 被挂载或渲染后调用。在这里，您可以访问 DOM 元素，并且可以执行 DOM 操作，例如获取 innerHTML：
console.log(element.innerHTML)
So your questions:
所以你的问题：
Is there any case where?created?would be used over?mounted?
Is there any case where?created?would be used over?mounted?
Created is generally used for fetching data from backend API and setting it to data properties. But in SSR mounted()hook is not present you need to perform tasks like fetching data in created hook only
Created 通常用于从后端 API 获取数据并将其设置为数据属性。但是在 SSRmounted()钩子不存在时，您只需要执行诸如在创建的钩子中获取数据之类的任务
What can I use the?created?event for, in real-life (real-code) situation?
What can I use the?created?event for, in real-life (real-code) situation?
For fetching any initial required data to be rendered(like JSON) from external API and assigning it to any reactive data properties
用于从外部 API 获取要呈现的任何初始所需数据（如 JSON）并将其分配给任何反应数据属性
data:{
myJson : null,
errors: null
},
created(){
//pseudo code
database.get().then((res) => {
this.myJson = res.data;
}).catch((err) => {
this.errors = err;
});
}
