关于报错"Templates should only be responsible for mapping the state to the UI"的原因整理

1.vue中实例挂载的元素节点名称不明确导致的

下面还原下过程:

①在index.html中引入头部信息top.html

②top.html引入top.js

**top.html,其最外层div的id取名为top(加入id是为了vue进行挂载)

**top.js,通过"#top"进行挂载

结果页面会报错,其报错信息如下(精简过):

[Vue warn]: Error compiling template:

<div id="top"><script type="text/javascript" src="./page-js/top.js"></script>
<div id="top">
	<div class="header">
	.........
</div>
</div>

- Templates should only be responsible for mapping the state to the UI. Avoid placing tags with side-effects in your templates, such as <script>, as they will not be parsed.

(found in <Root>)

最后发现原因,在index.html中也定义了id="top",导致了这个问题

所以,解决方式就是要么重命名index.html中id="top",要么重名vue挂载点id名称