vue 挂载点 实例 模板

Posted 1点

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue 挂载点 实例 模板相关的知识,希望对你有一定的参考价值。

挂载点:vue实例 里面的el属性 对应的 id 所在的dom节点

模板:指的是挂载点内部的内容
          模板可以写在挂载点内部
          也可以写在属性里面

demo 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue入门</title>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
</head>
<body>
  <div id="first">

  </div>
  <script>
      new  Vue({
        //绑定上面的id el指的是vue实例跟哪个dom节点绑定
        el:"#first",
        template:\'<h1>hello{{msg}}</h1>\',
        data:{
          msg:"world"
        }
      })
  </script>
</body>
</html>

 效果:

 

 

 

2018-05-01    11:20:11   

 

以上是关于vue 挂载点 实例 模板的主要内容,如果未能解决你的问题,请参考以下文章

vue挂载点概念

DAY67-前端入门-javascript(十三) vue03

vue四种挂载方式区别

vue学习笔记——Vue实例以及生命周期

vuejs挂载点,模板与实例的关系

VSCode自定义代码片段——.vue文件的模板