三.methods属性
2019-03-10 本文已影响0人
A_x_A
methods 名字固定 ，是一个对象，用于储存方法
调用方法--------------------- {{方法名()}}
调用方法时，同时传参数
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
<h2>{{greeting('afternoon')}}</h2>
<h2>{{message}}</h2>
</div>
<script type="text/javascript">
//实例化一个vue对象
var app = new Vue({
el: '#app',
data:{
message:'Hello Vue！',
},
methods:{
greeting:function(time){
return 'Good' + time+'!';
}
}
})
</script>
</body>
</html>
如果要在当前对象中拿data的属性，直接使用Vue实例化的对象.name就可以了，调用方法时也是直接拿对应的方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
<h2>{{greeting('afternoon')}}</h2>
<h2>{{message}}</h2>
</div>
<script type="text/javascript">
//实例化一个vue对象
var app = new Vue({
el: '#app',
data:{
message:'Hello Vue！',
name:'软件1721'
},
methods:{
greeting:function(time){
return 'Good' + time+'!' +this.name;
}
}
})
</script>
</body>
</html>
对象.name.png
