我有一个简单的 Vue.js 应用程序，带有这个模板：
<h1>{{ name || '<New Document>' }}</h1>
我的目标是，如果name为假，则使用 text <New Document>。这不是一个自定义标记标签。我希望 Vue.js 将其插入到文档中：
<h1><New Document></h1>
相反，我在控制台上收到此警告：
[Vue 警告]：未知的自定义元素：-您是否正确注册了组件？对于递归组件，请确保提供“名称”选项。
根据文档，使用一对大括号{{和}}，表示文本插值，文本将使用该表达式值。相反，Vue.js 似乎想将其视为 HTML。
为什么会这样？如何解决？
Vue 的模板解析器首先解析 HTML（分为标签及其内容），然后才解析标签属性和文本。
对于您的模板，它将类似于：
tag: <h1>
|
+- text: "{{ name || '"
|
+- tag: <New> (attributes: ["Document"])
|
+- text: "' }}"
您应该首先将模板视为有效的 HTML，然后添加 Vue 的插值。
文件还指出：
所有 Vue.js 模板都是有效的 HTML，可以由符合规范的浏览器和 HTML 解析器进行解析。
参考：compiler/parser/html-parser.js
| 归档时间： |
|
| 查看次数： |
1021 次 |
| 最近记录： |