12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Document</title>
- <style>
- #div1{
- width: 200px;
- height: 200px;
- background: red;
- }
- #div2{
- width: 100px;
- height: 100px;
- background: green;
- }
- </style>
- </head>
- <body>
- <div id="app">
- {{msg}}
- {{num}}
- <!-- <button v-on:click="fn">btn</button> -->
- <button @click="fn">btn</button>
- <div id="div1" @click="fn1">
- 111
- <div id="div2" @click="fn2">
- 222
- </div>
- </div>
- <input type="text" @keyup="fn3">
- <input type="text" @keyup.enter="fn4">
- </div>
-
- <script src="vue.js"></script>
- <script>
- new Vue({
- el: '#app',
- data:{
- msg:'hello',
- num: 1
- },
- methods:{
- fn(){
- console.log(111)
- },
- fn1(){
- console.log('div1')
- },
- fn2(){
- console.log('div2')
- },
- fn3(){
- console.log(event.keyCode)
- },
- fn4(){
- console.log('hahahahahah')
- }
- }
- })
- </script>
- </body>
- </html>
|