问题标签 [svelte-component]

你好 Sveltermeisters，

问题：我正在尝试在同一页面上初始化 App 的两个实例。App 在 main.js 文件中作为页面上的全局变量公开，如下所示：

然后在一个 html 页面中初始化两个应用实例

奇怪的是：第二个 app 的 props 会覆盖第一个 app 的 props，并且每个 app 的状态始终保持同步，无论打开哪个 app。

我的断言：由于道具被倾倒到商店中，第二个实例将覆盖第一个实例。由于每个应用程序都引用同一组商店，因此它们的数据始终保持同步。

这是真的？如果是这样，我该如何设计我的商店以使他们的数据保持独立？

当单击父组件中的图标/按钮时，我基本上需要能够在一个或多个组件中触发某些东西（通过 svelte:component 动态添加）。例如，我需要挂钩下面用 ** 表示的部分：-

我可以通过取消一组道具来获得一些工作，但是当数组更改时会通知每个组件，所以这不是很干净。

我已经搜索了 Google 和 StackOverflow，并在 Svelte Discord 频道中提出了这个问题，但目前没有运气。

Svelte Repl 显示问题

这似乎是一个简单的要求，但是几天后我仍然卡住了，因此非常感谢有关如何将事件传递到动态组件的任何建议。

有没有一种简单的方法可以强制重启 Svelte 组件？

重启用例：

• 清除 HTML 文件输入的文件列表（不能重置路径/值）
• 使用 CSS 悬停时选择项目后导航栏下拉折叠

也许除了重启还有其他解决方案，但让我们在这里使用组件重启。

在适用于上传用例的重启代码下方：

SomeApp.svelte

上传.svelte

更新：
如果组件未渲染，组件将被销毁。因此，当您切换组件周围的 if 块时，您可以停止和重新启动组件。

示例：
1.将运行从 true 切换为 false 以销毁 Upload 组件
2.将 run 从 false 切换为 true 以重新启动 Upload 组件

您可以使用计时器来切换重启。

我使用 Sapper 框架，我想打开我自己的开发工具窗口，该窗口应该可以完全访问主窗口的 Javascript 对象。

我正在尝试使用苗条的组件和相同的 Javascript 上下文创建一个新窗口：

它可以工作，但没有 CSS 样式。

您可以使用此 REPL进行测试。

如何为新窗口应用组件 CSS 样式？

或者创建此类窗口的最佳实践是什么？

我正在尝试在值更改时触发组件更新

它适用于 css 更新，例如 '$: cssColorValue = calcRandomColor()' 但如果我使用数组，例如 '$: values = [...newValues]'

我想要的是让 Svelte 重新渲染 for each 循环

我有一个包含选择、输入字段等的工作表单元素的 php 页面。
我希望表单在没有 js 的情况下继续工作，但如果 js 可用，我想将标准输入转换为增强的 Svelte 组件。
你会如何处理这个问题？
例如。如何将可用于选择标签的所有“选项”传递给将替换它的苗条组件？

我正在使用 SveleteJS 进行试驾并卡住了

制作了一个Dashboard组件，在该组件内部，我放置了一个白板组件：

Whitebord.svelte：

当我单击按钮时，console.log触发器和我可以看到线条的大小增加，但我没有看到它在页面上呈现，只有空的红色 div 包裹它。

我已经尝试添加$:到各个地方，但我还不确定它应该在哪里使用以及不应该在哪里使用，并不是说它有什么不同。

我如何让#each 呈现一个 div 列表（此外，on:click从

我有一个由不同类型的组件（父母）使用的组件。这个组件的行为稍微取决于谁是他的父母（父母的种类）。

当然，我可以将父母的名字作为道具或绑定或......

我的问题：嵌套组件是否有可能自己找出谁是父级？在 onMount 期间？

我有一个名为WastedTime.sveltevalue的组件wastedTime。还有一个函数可以将值更改为50（在我的真实代码中，这是一个动画，但这是 Stack Overflow 的简化测试用例）。

为了允许从父级调用子函数，我使用<script context="module">了 Svelte 文档：

父母从以下位置调用孩子中的函数onMount：

问题是，既然wastedTime提到了<script context="module">，它似乎无法改变wastedTime。导出的函数运行，但wastedTime保持为 0。

这个在 Svelte REPL 上的副本

我试过： -var wastedTime = 0投入<script context="module"> -var wastedTime = 0投入<script>

两者都不起作用。

如何从 Svelte 组件中导出更改组件中值的函数？

当我单击 svelte 中的表格行时，我想创建一个弹出菜单。我使用该document.querySelectorAll方法将 onclick-event 添加到内部的每个表行onMount。在onMount函数中，我还重新渲染了显示的表格。如何将 onclick 值应用于重新渲染的元素？

但是当我添加超时时：

可以在此处找到带有完整源代码的 REPL