本文介绍了一个简单的Vue.js应用实例，通过一段简洁的代码展示了如何在网页中使用Vue.js显示动态内容，并强调了Vue.js易于上手的特点。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>vue helloword</title>
<script src="js/vue.min.js"></script>
<style type="text/css">
#app{width:600px;margin:100px auto; text-align:center; color:red; font-size:22px;}
#app p{font-size:16px; color:#000; text-align:left;}
</style>
</head>
<body>
<div id="app">
{{ message }}
<br />
<br />
<p>这个很简单。使用一堆 script 标签就可以让代码跑起来。从这里可以看出，利用 Vue 的功能特性的好处就是无需学习任何新的技术。</p>
</div>
<script type="text/javascript">
var helloword=new Vue({
el: '#app',
data: {
message: 'helloWord：问候语来自Vue.js'
}
});
</script>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>vue helloword</title>
<script src="js/vue.min.js"></script>
<style type="text/css">
#app{width:600px;margin:100px auto; text-align:center; color:red; font-size:22px;}
#app p{font-size:16px; color:#000; text-align:left;}
</style>
</head>
<body>
<div id="app">
{{ message }}
<br />
<br />
<p>这个很简单。使用一堆 script 标签就可以让代码跑起来。从这里可以看出，利用 Vue 的功能特性的好处就是无需学习任何新的技术。</p>
</div>
<script type="text/javascript">
var helloword=new Vue({
el: '#app',
data: {
message: 'helloWord：问候语来自Vue.js'
}
});
</script>
</body>
</html>
扫一扫
1550
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
