<!DOCTYPE html>
<html xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8">
<title>Vue 测试实例 - 菜鸟教程(runoob.com)</title>
<script src="https://unpkg.com/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
{{message}}
<ul >
<li v-for="(v,index) in loves"> {{v.name}}---{{v.age}}----{{v.iq}} </li>
</ul>
<input name="name" v-model="message">
<input name="button" type="button" value="点我" v-on:click="check()">
</div>
<script>
var Vm=new Vue({
el:"#app",
data:{
message:"内容",
like:"apple",
loves:[{name:"姓名:"+"a",age:"年龄"+1,iq:"智商"+-999},{name:"姓名:"+"b",age:"年龄"+999,iq:"智商"+1}]//二维数组
},
methods:{
check:function(){
// alert(333);//验证是否能够使用
Vm.message="点击后修改的内容"
}
}
});
</script>
</body>
</html>
Vue入门基础(代码)
最新推荐文章于 2023-05-17 19:46:30 发布