<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>内容与属性中使用javascript表达式的方法</title>
<script src="vue.js"></script>
</head>
<body>
<style>
.hd1{ color: red;}
.hd2{ color: green}
</style>
<div id="hdcms">
<h1 v-once="">{{n}}</h1>
{{n+3}}
<h1 :class="'hd'+n">你好，中国</h1>
<input type="text" v-model="n"/>
<br>
<input type="radio" v-model="n" value="1">红色
<input type="radio" v-model="n" value="2">绿色
</div>
<script>
var app = new Vue({ //生成对象的方式
el: "#hdcms", //el:是元素
data:{ //data：数据
n:1
}
});
</script>
</body>
</html>