在vue的学习过程中我写了一个简单的实例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Vue组件的学习中遇到的错误</title>
<script src="../vue.js"></script>
</head>
<body>
<div id="app">
<my-list></my-list>
</div>
<script>
Vue.component("my-list",{
template:"<h1>Hello World</h1><h2>HelloTime</h2>",
});
new Vue({
el:"#app",
})
</script>
</body>
</html>出现了如下的错误：
vue.js:597 [Vue warn]: Error compiling template:
<h1>Hello World</h1><h2>Hello Time</h2>
- Component template should contain exactly one root element. If you are using v-if on multiple elements, use v-else-if to chain them
instead.
found in
—><MyList>
问题的解决：
原来错误发生在这句代码上面：
template:"<h1>Hello World</h1><h2>Hello Time</h2>"正确的写法应该是这样：应该使用一个根元素把多个元素包括起来。
template:"<div><h1>Hello World</h1><h2>Hello Time</h2><div>"