Vue.js:有没有办法知道组件实例何时被挂载? [英] Vue.js: Is there a way to know when the component instance is mounted?
本文介绍了Vue.js:有没有办法知道组件实例何时被挂载?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
是否可以在每个组件实例中访问一个布尔值来了解组件何时安装?
类似于:
<div><span v-if="$mounted">我安装了</span><span v-if="$created">我被创建了</span><span>在创建和安装之前调用</span></模板>
解决方案
UPDATE 2020
Vue.js 有一个未公开的功能，您可以在其中知道组件的生命周期钩子何时执行:来源.
语法如下:
示例:
如何知道子组件何时被挂载:
如何知道子组件何时被创建:
<div><span v-if="mounted">我安装了</span><span v-if="created">我被创建了</span><span>在创建和安装之前调用</span></模板>
和脚本:
export default {数据:() =>({创建:假，安装:假}),创建(){this.created = 真},安装(){this.mounted = true}}Is there a boolean we can access in each component instance to know when a component is mounted?
Something like:
<template>
<div>
<span v-if="$mounted">I am mounted</span>
<span v-if="$created">I am created</span>
<span>Called before created and mounted</span>
</div>
</template>
解决方案
UPDATE 2020
There is an undocumented feature of Vue.js where you can know when a component's lifecycle hook is executed: Source.
The syntax is as follows:
<ChildComponent @hook:lifecycleHookName="callAMethod" />
Examples:
How to know when a child component is mounted:
<ChildComponent @hook:mounted="componentMountedDoSomething" />
How to know when a child component is created:
<ChildComponent @hook:created="componentCreatedDoSomething" />
<template>
<div>
<span v-if="mounted">I am mounted</span>
<span v-if="created">I am created</span>
<span>Called before created and mounted</span>
</div>
</template>
And the script:
export default {
data: () => ({
created: false,
mounted: false
}),
created () {
this.created = true
},
mounted() {
this.mounted = true
}
}
这篇关于Vue.js:有没有办法知道组件实例何时被挂载?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
