#### 2.2 HelloWorld > 作用:将数据应用在html页面中 1. body中,设置Vue管理的视图<div id="app"></div> 2. 引入vue.js 3. 实例化Vue对象 new Vue(); 4. 设置Vue实例的选项:如el、data... new Vue({选项:值}); 5. 在<div id='app'></div>中通过{{ }}使用data中的数据
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <!-- 数据渲染界面 --> <div id="app"> <p>{{msg}}</p> </div> <script src="./js/vue.js"></script> <script> new Vue({ el: '#app', //模板ajax返回的数据 data: { msg: '我是歌谣' } }) </script> </body> </html>
