diff --git a/hello.html b/hello.html new file mode 100644 index 0000000..5865552 --- /dev/null +++ b/hello.html @@ -0,0 +1,42 @@ +<html> + <head> + <title>Hello</title> + <script src="https://cdn.jsdelivr.net/npm/vue"></script> + <script> + window.onload = function(){ + var app = new Vue({ + el: '#app', + data:{ + msg: 'hello', + list: [ + {id:111, name:'Taro'}, + {id:222, name:'Ken'}, + {id:333, name:'Hanako'} + ] + } + }); + } + </script> + </head> + <body> + <h1>サンプル</h1> + <div id="app"> + <h2>メッセージ</h2> + {{msg}} + + <h2>サンプルテーブル</h2> + <table> + <thead> + <tr><th>No</th><th>ID</th><th>名前</th></tr> + </thead> + <tbody> + <tr v-for="(v, index) in list" v-bind:key="index"> + <td>{{index+1}}</td> + <td>{{v.id}}</td> + <td>{{v.name}}</td> + </tr> + </tbody> + </table> + </div> + </body> +</html>