【无标题】

最新推荐文章于 2024-11-08 16:09:18 发布

x65456

最新推荐文章于 2024-11-08 16:09:18 发布

阅读量48

点赞数

文章标签： javascript 前端 vue.js

本文链接：https://blog.csdn.net/x65456/article/details/128473968

版权

生命周期

1 什么是生命周期？
从Vue实例创建、运行、到销毁期间，总是伴随着各种各样的事件，这些事件，统称为生命周期。

2 生命周期的函数介绍

 // 一般用于页面的重定向
            beforeCreate() {
                console.log(this.msg);
                console.log('beforeCreate');
            },
            // 初始化已经完成，第一个可以操作data,methods的生命周期
            // 一般用于接口请求和数据初始化。
            created() {
                console.log('created');
                console.log(this.msg);
            },
            // 挂载的虚拟的DOM
            beforeMount() {
                console.log('beforeMount');
                // debugger
            },
            // 真实的DOM，第一个操作DOM元素的生命周期
            mounted() {
                console.log('mounted');
            },
            // 可以执行0次或者多次
            // data中的数据是最新的，页面中还是旧的
            beforeUpdate() {
                console.log('beforeUpdate');
            },
            // data和页面中都是最新的数据
            updated() {
                console.log('updated');
            },
            // 清空定时器以及页面监听
            beforeDestroy() {
                console.log('beforeDestroy');
            },
            // 销毁完成
            destroyed() {

            }

3时间过滤器的使用

视图层的代码

     <td>{{item.cTime | setTime('YYYY/MM/DD/h:f:s')}}</td>

调度层

   carList: [
                    {
                        id: 1,
                        carName: '奔驰',
                        cTime: new Date()
                    },
                    {
                        id: 2,
                        carName: '宝马',
                        cTime: new Date()
                    }
                ],

这里是创建了一个过滤器对时间进行过滤，再进行时间的格式设定。

    Vue.filter('setTime',function(data,format){
        let y = data.getFullYear()
        let m = (data.getMonth() + 1).toString().padStart(2,0)
        let d = data.getDate().toString().padStart(2.0)
        let h = data.getHours()
        let f = data.getMinutes().toString().padStart(2.0)
        let s = data.getSeconds().toString().padStart(2.0)
        return format.replace('YYYY',y).replace('MM',m).replace('DD',d).replace('h',h).replace('f',f).replace('s',s)
    })