vue 過濾器

    <!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>


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章