在IDEA中安装vue插件
<!DOCTYPE html>
<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8">
<title>VUE DEMO</title>
<!-- 从文件引入 -->
<script src="browser_components/vue/dist/vue.js" ></script>
<!-- 从w网络引入 -->
<script src="https://cdn.bootcss.com/vue/2.5.20/vue.min.js"></script>
</head>
<body>
<div id="app">
<p v-text="message">这是一个演示</p>
<input type="text" v-model="desc">
<button v-on:click="hello">测试</button>
</div>
</body>
<script>
//声明视图模型
let app = new Vue({
el:"#app",
data:{
message: 'Hello World!',
desc: 'Hello Vue.js'
},
methods:{
hello:function () {
console.log("点击了测试按钮")
this.message = this.desc;
}
}
});
</script>
</html>