继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

vue 过滤器

kala16
关注TA
已关注
手记 260
粉丝 18
获赞 134

    <!DOCTYPE html>

    <html>

        <head>

            <meta charset="utf-8" />

            <title>过滤器</title>

        </head>

        <script type="text/javascript" src="js/vue.js" ></script>

        <script>

            Vue.filter('date',data=>{

                let date = new Date(data);

                return date.getFullYear()+'-'+(date.getMonth()+1)+'-'+date.getDate()+' '+date.getHours()+':'+date.getMinutes()+':'+date.getSeconds();

            })

            window.onload = function(){

                //配置是否允许检查代码,方便调试,生产环境中设置为false

                Vue.config.devtools = true;  //检查代码

                Vue.config.productioinTip = false;  //有强迫症的,可以关掉生产中的提示信息

                let vm = new Vue({

                    el: "#div1",

                    data:{

                        currentTime: Date.now()

                    },

                    filters:{

                        time: data=>{

                            let date = new Date(data);

                            return date.getFullYear()+'-'+(date.getMonth()+1)+'-'+date.getDate()+' '+date.getHours()+':'+date.getMinutes()+':'+date.getSeconds();

                        }

                    }

                });

            }

        </script>

        <body>

            <div id="div1">

                <h1>{{currentTime | time}}</h1>

            </div>

        </body>

    </html>


打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP