第一个Vue程序

来自CloudWiki
Cloud17讨论 | 贡献2022年2月6日 (日) 09:02的版本
跳转至: 导航搜索

操作步骤

引入vue文件

<head>
		<meta charset="utf-8">
		<script src="vue.js" type="text/javascript" charset="utf-8">

		</script>


		<title></title>
	</head>

视图层

	<div id="app">
			{{ message }}
		</div>

脚本

创建一个叫app的Vue对象,

绑定元素app ,赋值message 'Hello Vue'

		<script type="text/javascript">
			var app = new Vue({
				el: '#app',
				data: {
					message: 'Hello Vue!'
				}
			})
		</script>

代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script src="vue.js" type="text/javascript" charset="utf-8">

		</script>


		<title></title>
	</head>
	<body>
		<div id="app">
			{{ message }}
		</div>
		<script type="text/javascript">
			var app = new Vue({
				el: '#app',
				data: {
					message: 'Hello Vue!'
				}
			})
		</script>
	</body>
</html>