1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61
| <html> <head> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> </head> <body> <div id="app"> methods <div> test1(): {{ test1() }} {{ test2() }} {{ test3() }} {{ test4('hello') }} {{ test5('world') }} </div> <div> message: {{ message }} </div> </div> </body> <script> var app = new Vue({ el: '#app', data: { message: 'message', }, methods: { test1() { console.log("==test1()=="); this.message = "test1()" }, test2:() => { console.log("==test2()=="); this.message = "test2()" }, test3:function() { console.log("==test3()=="); this.message = "test3()" }, test4:function(val) { console.log("==test4()=="); console.log("test4(val):" + val); this.message = "test4()" }, test5:(val) => { console.log("==test5()=="); console.log("test5(val):" + val); this.message = "test5()" } } }); </script> <style> html, body { margin: 5px; padding: 0; } </style> </html>
|