created

即通常初始化某些属性值，而后再渲染成视图

mounted

在模板渲染成html后调用，通常是初始化页面实现后，再对html的dom节点进行一些操作。

<body>    <div id="example1">        <demo1></demo1>    </div>    <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>    <script>        Vue.component("demo1",{             data:function(){                return {                    name:"",                     age:"",                     city:""                }            },            template:"<ul><li id='name'>{{name}}</li><li>{{age}}</li><li>{{city}}</li></ul>",            created:function(){                 this.name="Eric"                this.age = "20"                this.city ="广州"                var x = document.getElementById("name") // ①第一个命令台谬误                console.log(x.innerHTML);               },              mounted:function(){                  var x = document.getElementById("name") // ②第二个命令台正确                  console.log(x.innerHTML);             }          });         var vm = new Vue({            el:"#example1",        })    </script></body>

① 在created的时候，视图中的html还没有被渲染进去，所以此时如果间接去操作html的dom节点，肯定找不到相干的元素。
② 而在mounted中，因为此时html曾经渲染进去了，所以能够间接操作dom节点，故输入了后果。