new Vue({
el:'#app',
data:{
//多个属性之间用“,”隔开，除了数字意外，其他应该都为字符串格式，否则不认
name:'zhaodaxin',
age:24,
link:'https://www.baidu.com/img/bd_logo1.png?where=super'
},
//methods 复数形式
methods:{
getTripleAge:function(){
return this.age*3;
},
changeName:function(){
this.name='daxin';
return this.name;
}
}
})
<div id="app">
<!--为了不让下面的changeName影响到这里，所以使用了v-once指令-->
<h1 v-once>name: {{name}}</h1>
age: {{age}}<br>
age2: {{ getTripleAge() }}<br>
<!--给属性赋值需要使用v-bind指令，属性放在冒号后，v-bind:src可以简写成 :src-->
<img v-bind:src="link" alt=""/>
<input type="text" v-bind:value="name"/><br>
changeName: {{ changeName()}}
</div>