注：学习vue之前要有一定的HTML、CSS以及JavaScript基础
由于起步阶段不推荐新手直接使用vue的脚手架（vue-cli)来开发
所以这里我们使用CND引入->vue的安装方式
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div id="app">
this is app{{message}}
</div>
<div class="test">
this is test{{message}}
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script type="text/javascript">
// let-->定义变量 const-->定义常量
//通过new关键字创建vue实列
const app= new Vue({
el:"#app", //用于要挂载要管理的元素
data:{ //定义数据
message:"Hello World",
}
})
</script>
</body>
运行结果
this is app Hello World
this is test {{message}}
因为vue实列中el所挂载的元素是app，vue只会管理app内的元素，所以{{message}}在元素test中是无法被渲染出来的。
本站由
1493
条评论 我要发表评论