v-bind
<body>
<div id="app">
<!--v-bind: 是vue中提供的用于绑定属性的指令-->
<!--<input type="button" value="按钮" v-bind: title="mytitle">-->
<input type="button" value="按钮" :title='mylittle'>
</div>
<script src="./lib/vue-2.4.0.js"></script>
<script>
var vm=new Vue({
el: '#app',
data: {
msg: '123',
msg2: '<h1>我是一个粉刷匠</h1>'
mytitle: '这是一个自己定义的title'
}
})
</script>
v-on
<body>
<div id="app">
<!--Vue中提供了v-on: 事件绑定机制-->
<!--<input type="button" value="按钮" v-on:click="show">-->
<!--缩写@click-->
<input type="button" value="按钮" v-on:mouseover="show">
</div>
<script src="./lib/vue-2.4.0.js"></script>
<script>
var vm=new Vue({
el: '#app',
data: {
msg: '123',
msg2: '<h1>我是一个粉刷匠</h1>'
mytitle: '这是一个自己定义的title'
},
methods: { //这个methods属性中定义了当前Vue实例所有可用的方法
show: function(){
alert('Hello')
}
}
})
</script>