版
2.6.10
复制链接
https://github.com/tbutcaru/v-issue-multiple-dynamic-slot-names
重现步骤
- 克隆此仓库： https :
- 运行：
npm install - 运行：
npm run serve
期望什么？
多个动态插槽名称应按预期工作。
实际发生了什么？
引发以下错误：
Invalid dynamic argument expression: attribute names cannot contain spaces, quotes, <, >, / or =.#[headerslot]>Header slot</template>
Default slot
<template #[footerslot]
如果将其中一个动态插槽名称设置为静态（与哪个无关），则该应用程序正在运行。
我的调查
- 档案：
node_modules/vue-template-compiler/build.js - 第2563行（在
attrs.forEach(function (attr) {）添加了以下警告：
warn$1('--------------->> ' + attr.name);
调查结果：
- 在只有一个动态插槽名称的工作方案中：该动态插槽名称的值为
#[headerslot] - 在具有两个动态插槽名称的错误情况下：第一个动态插槽名称的值为
#[headerslot]>Header slot</template>
Default slot
<template #[footerslot]
因此，当存在多个动态插槽名称时，似乎编译器不知道如何仅提取属性。
tbutcaru
👍5
所有7条评论
Justineo
于 2019-03-27
👍2
仅当提供参数时，速记才可用。 尝试使用：
<template v-slot:[dynamicSlotName]>
...
</template>
michalzaq12
于 2019-03-28
仅当提供参数时，速记才可用。 尝试使用：
<template v-slot:[dynamicSlotName]> ... </template>
我在创建问题之前已经尝试过，结果是一样的
tbutcaru
于 2019-03-28
👀1
嗨，大家好！
有什么新消息吗？ 我仍然在2.6.11的问题这里重现
davis90
于 2020-01-22
经过多次尝试，我找到了使多个动态广告位起作用的方法。 当我将键添加到动态插槽模板的根元素时，它就起作用了：
这不起作用：在此处复制
<template #[slot1]>
<p>slot test</p>
</template>
<template #[slot2]>
<p>slot test2</p>
</template>
// got "Invalid dynamic argument expression: attribute names cannot contain spaces, quotes, <, >, / or ="
这项工作：在这里复制
<template #[slot1]>
<p key="1">slot test</p>
</template>
<template #[slot2]>
<p key="2">slot test2</p>
</template>
// work fine
为什么我需要添加密钥才能使其正常工作？ 我错过了什么。
davis90
于 2020-01-22
❤4
@ davis90的解决方案对我
SreeChandan
于 2020-06-08
为什么这些错误会引起误导。 谢谢，尽管您的解决方案有效
Moizsohail
于 2020-07-20
此页面是否有帮助？
0 / 5 - 0 等级
相关问题
franciscolourenco
·
3评论
gkiely
·
3评论
finico
·
3评论
guan6
·
3评论
seemsindie
·
3评论
最有用的评论
经过多次尝试，我找到了使多个动态广告位起作用的方法。 当我将键添加到动态插槽模板的根元素时，它就起作用了：
这不起作用：在此处复制
这项工作：在这里复制
为什么我需要添加密钥才能使其正常工作？ 我错过了什么。