<html><head><title>永远朋友</title><script src="../js/vue.js"></script></head><body><div id = "app"><input type="text" v-model="message">{{ message }}</div></body><script>new Vue({el : "#app",data : {message:"hello vue!"}})</script>
</html> 
<html><head><script src = "../js/vue.js"></script></head><body><div id="app"> <a v-bind:href = "u">链接1</a><a :href= "u">链接2</a><input type="text" v-model="u"></div></body><script>new Vue({el:"#app",data:{u:"https://www.baidu.com"}})</script>
</html>
<html><head><script src="../js/vue.js"></script></head><body><div id = "app"><table border="1" cellspacing="0" width="60%"><tr><th>编号</th><th>姓名</th><th>年龄</th><th>性别</th><th>成绩</th><th>等级</th></tr><tr align="center" v-for="(user, index) in users"><td>{{index+1}}</td><td>{{user.name}}</td><td>{{user.age}}</td><td><span v-if="user.gender == 2">女</span><span v-else="user.gender == 1">男</span></td><td>{{user.socre}}</td><td><span v-if="user.socre < 60" style="color: red;">不及格</span><span v-else-if="user.socre >= 60 && user.socre < 80">及格</span><span v-else="user.socre >= 80">优秀</span></tr></tr></table></div></body><script>new Vue({el : "#app",data : {users:[{name:"Tom",age:18,gender:1,socre:99},{name:"john",age:19,gender:2,socre:79},{name:"ave",age:23,gender:2,socre:56} ]},})</script>
</html>
