6.vue方法.html 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Document</title>
  7. </head>
  8. <body>
  9. <div id="app">
  10. <h1>{{timer}}</h1>
  11. </div>
  12. <script src="./vue.js"></script>
  13. <script>
  14. var app = new Vue({
  15. el:"#app",
  16. data:{
  17. msg:"你好啊",
  18. timer: ""
  19. },
  20. // 生命周期
  21. created() {
  22. this.getMain();
  23. },
  24. methods:{
  25. getTime() {
  26. let date = new Date();
  27. let year = date.getFullYear();
  28. let mouth = date.getMonth() + 1;
  29. let day = date.getDate();
  30. let hours = date.getHours();
  31. let minutes = date.getMinutes();
  32. let second = date.getSeconds();
  33. this.timer = year + '年' + mouth + '月' + day + '日' + hours + '时' + minutes + '分' + second + '秒';
  34. },
  35. getMain() {
  36. setInterval(()=>{
  37. this.getTime()
  38. },1000)
  39. }
  40. }
  41. })
  42. </script>
  43. </body>
  44. </html>