EEUI.APP EEUI.APP 首页 文档 - 指南 - 组件 - 模块 插件 - 插件市场 - 开发文档 热更新 控制台 Editor 例子 社区 GitHub 首页 文档 - 指南 - 组件 - 模块 插件 - 插件市场 - 开发文档 热更新 控制台 Editor 例子 社区 GitHub - 起步 - 框架介绍 - 搭建环境 - 创建项目 - 配置相关 - 开发调试 - 上手 - 使用 Vue.js - 平台差异 - 环境变量 - 生命周期 - 跨页面通信 - appboard - 应用图标 - 启动图片 - 应用设置 - 升级程序 - 样式 - 通用样式 - 文本样式 - CSS 单位 - 颜色值 - 事件 - 通用事件 - 事件冒泡 - 手势
    # # 生命周期

    虽然这是过时的方法，但是2.3.8版本之后也兼容。

    2.3.9版本之后请参考这里 TIP 除了自有的生命周期钩子以外，eeui还支持的原生生命周期回调lifecycle，含：页面挂载、页面恢复、页面暂停。 
    1. <template>
    2.     <div @lifecycle="lifecycle">
    3.         …
    4.     </div>
    5. </template>
    7. <script>
    8.     export default {
    9.         beforeCreate: function (){
    10.             console.log('beforeCreate');
    11.         },
    12.         created: function () {
    13.             console.log('created');
    14.         },
    15.         beforeMount: function () {
    16.             console.log('beforeMount');
    17.         },
    18.         mounted: function () {
    19.             console.log('mounted');
    20.         },
    21.         beforeUpdate: function () {
    22.             console.log('beforeUpdate');
    23.         },
    24.         updated: function () {
    25.             console.log('updated');
    26.         },
    27.         beforeDestroy: function () {
    28.             console.log('beforeDestroy');
    29.         },
    30.         destroyed: function () {
    31.             console.log('destroyed');
    32.         },
    33.         methods: {
    34.             //生命周期回调
    35.             lifecycle(e){
    36.                 console.log(e.status);
    37.                 if (e.status == 'ready')
    38.                 {
    39.                     console.log('页面挂载(初始化)');
    40.                 }
    41.                 else if (e.status == 'resume') 
    42.                 {
    43.                     console.log('页面激活(恢复)');
    44.                 }
    45.                 else if (e.status == 'pause') 
    46.                 {
    47.                     console.log('页面失活(暂停)');
    48.                 }
    49.                 else if (e.status == 'destroy') 
    50.                 {
    51.                     console.log('页面停止(销毁)');    //destroy 状态 1.0.38+ 版本支持
    52.                 }
    53.             }
    54.         }
    55.     }
    56. </script>
    ### # 生命周期钩子 Vue 组件的实例生命周期钩子将在特定的阶段发出，详情请参考 Vue 组件的生命周期图示。
    Vue 生命周期钩子 是否支持 说明
    beforeCreate 支持 -
    created 支持 -
    beforeMount 支持 -
    mounted 支持 详见下文解释
    beforeUpdate 支持 -
    updated 支持 -
    activated 不支持 不支持
    deactivated 不支持 不支持
    beforeDestroy 支持 -
    destroyed 支持 -
    errorCaptured 支持 -
    关于 "mounted" 生命周期 和浏览不同的是，eeui 的渲染流程是异步的，而且渲染出来的结果都是原生系统中的 View，这些数据都无法被 javascript 直接获取到。因此在 eeui 上，Vue 的 mounted 生命周期在当前组件的 virtual-dom (Vue 里的 VNode) 构建完成后就会触发，此时相应的原生视图未必已经渲染完成。 在 GitHub 上编辑此页

    最后一次更新: 7/24/2020, 11:56:07 PM