vue的基本使用

1.实例参数分析
el :元素的挂载位置(值可以是CSS选择器或者DOM元素)
data :模型数据(值是一个对象)
2.插值表达式{{}}
将数据填充到HTML标签中插值表达式支持基本的计算操作
3.案例

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta http-equiv="X-UA-Compatible" content="ie=edge">
 <title>Hello World</title>
 <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.min.js"></script>
</head>
<body>
   <h1>Hello</h1>
   <div id="app"> 
    {{message}}//两者的值保持一致的,显示的值就是 hello world!!
   </div>
 <script>
   var vm = new Vue({
   el:'#app',//这个app就是DIV的属性值里的app
   data:{
   message:'hello world!'
   }
});
 </script>
</body>
</html>
posted @ 2020-12-18 14:26  殷慈航  阅读(85)  评论(0编辑  收藏  举报