我想用vue替换我项目的第一个vanilla JS。
我试着让hello world的例子工作。
它的工作原理如前所述,但是当我将元素嵌套在另一个元素中时(这些可能是错误的术语),它就不起作用了。
我的源代码:
<!-- this works -->
<div id="app">
<p>${ message }</p>
</div>
<!-- but this doesn't for some reason -->
<div class="container">
<div id="app">
Nested ${ message }
</div>
</div>
Full code example。
引导需要***class=“container”***。
编辑:我把生成的html和编辑到最低限度,以显示它不工作。参见result。
3条答案
按热度按时间bgtovc5b1#
将容器用
应该是这样的
iqjalb3h2#
这很好,你的模板中的问题是你有两个id=“app”的元素,所以vue示例是用第一个id=“app”的元素初始化的,然后第二个(嵌套的)永远不会初始化。
8i9zcol23#
你有2个
#app
id,但只有一个vue示例。如果你需要两个#app
,你应该创建两个Vue示例。#app1的示例1和#app2的示例2。如果您需要在主题中进行交互,可以将主题保存在变量中: