vue入门——基本概念
Posted ly2646
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue入门——基本概念相关的知识,希望对你有一定的参考价值。
1. 挂载点,模板,实例的关系?
首先附上一个基本demo:
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8"> 5 <title>vue 入门</title> 6 <script src="./vue.js"></script> 7 </head> 8 <body> 9 <div id="root"> 10 <!-- <h1>{{msg}}</h1> --> 11 </div> 12 <script> 13 new Vue({ 14 el: "#root", 15 template: ‘<h1>{{msg}}</h1>‘, 16 data: { 17 msg: "HEllo Vue " 18 } 19 }) 20 </script> 21 </body> 22 </html>
解释:
挂载点:就是el 所代表的id为root的div,指明vue只对这个div起作用
模板:div里面的内容
实例:在vue实例中指定了挂载点,模板,vue会自动结合模板和数据生成最后的内容,然后把内容放在挂载点之中
以上是关于vue入门——基本概念的主要内容,如果未能解决你的问题,请参考以下文章
Vue学习——Vuex核心概念(StateGetterMutationActionModule)