<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="vue.js" ></script>
</head>
<style type="text/css">
.active{
background-color:orange;
font-size: 20px;
color: #fff;
}
</style>
<body>
<div id="app">
<p :style="{color:fontColor}">{{msg}}</p>
<button v-on:click="msg='今天天气好热啊'">学习</button>
<button @click="changeContent()">xx</button>
<button @click="changeContentColor()">xbbbbbx</button>
<script type="text/javascript">
new Vue({
el:'#app',
data:{
msg:'今天天气很好',
indexActive:3,
fontColor:'red'
},
methods:{
changeContent(){
alert(0)
this.msg='这个改到了呀'
},
changeContentColor(){
this.fontColor='blue'
}
}
})
</script>
</body>
</html>
vue的v-on
最新推荐文章于 2024-05-16 09:41:57 发布