问题标签 [svelte-3]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
1543 浏览

javascript - Svelte 组件存储 - 将状态加载到 - 从 URL 哈希参数

如果我们有一个使用Svelte构建的应用程序,其中包含一堆组件和一个我们保存当前应用程序状态的商店,是否有推荐的方法将商店状态更改存储到当前 URL 的 # 哈希部分和能够从完整的 URL 重新加载相同的状态吗?

可以通过使用 解析当前 URL 来手动完成location.search()

可以使用 存储参数location.search("key", "value")

一些问题:

  • 何时从 URL 加载状态?App init 入口点是什么?
  • 何时将状态从商店存储到 URL?有没有通用的方法来做到这一点?
0 投票
2 回答
4026 浏览

svelte - 当任何一组变量发生变化时,Svelte 执行函数

Svelte RealWord App中有这样的东西:

当页面大小或其他查询参数发生变化时,这会调用 REST API。

我对列出实体有类似的情况,并且这样做:

这一切都很好(尽管 && 是一个奇怪的结构,说我想在或更改getData()时执行。activePagesortpageSize

当您还想包含评估为 Falsy 的变量时,使用这种方法会出现问题。

例如,添加searchQuery文本:

现在反应性不起作用,因为searchQuery评估为false

我们做得到:

但是有了这个 getData() 被调用了 2 次。

有人知道更好的方法吗?

0 投票
1 回答
406 浏览

svelte - 苗条的组件不刷新

我正在与 svelte 合作开展个人项目(springboot + svelte + heroku)。我很难理解为什么在尝试重新显示组件时组件不刷新:

这是一个要点:https ://svelte.dev/repl/a69ac7502677400081122453aa45dfbb?version=3.7.1

第一个app显示组件首先点击【前进】显示组件其次。但是然后单击 [backward] 不会像我预期的那样带回组件 First。

我的总体想法是使用 svelte 来管理面向标签的应用程序:每个标签都是一个组件和子组件。单击选项卡将显示和隐藏选项卡组件。即使它对第一个选项卡更改效果很好,但接下来会失败。

我很确定有可能得到这样的行为,但我想我一定误解了一些东西......

有人可以解释我吗?

谢谢

0 投票
0 回答
316 浏览

scroll - Sapper中的goto功能后如何保留滚动位置?

使用 Sapper 中的功能导航后goto(),滚动顶部位置设置回零。有没有一种简单的方法来控制它。特别是在使用时replaceState: truereplaceState: true滚动顶部使用选项设置回零有点奇怪。

编辑:输入字段也失去焦点之后goto(/url, {replaceState: true})。我觉得这种行为很奇怪。带replaceState: true选项。goto()应该保留这些(滚动位置..输入焦点..等)或可能..

Edit-2:这也是history.replaceState(). 不会丢失滚动位置和输入字段焦点。

0 投票
2 回答
1744 浏览

session - Sapper/svelte3 会话在没有页面重新加载的情况下不同步

我无法让 Sapper 在没有页面加载的情况下同步在我的服务器端路由中所做的会话更改。我的示例场景是我在会话中没有用户的情况下加载我的应用程序,我的服务器端登录路由将用户设置为会话,然后我使用goto它来访问仪表板。

问题是session仪表板的预加载函数中的参数未填充。如果我使用window.location.href = '/dashboard',它是,因为它通过 Sapper 的page_handler运行。但是,如果我只进行客户端重定向,Sapper 不会将更新的会话发送到客户端。

有什么办法吗?我用错工具了吗?

注意:我正在使用 connect-pg-simple 和 express-session,像这样设置 sapper sapper.middleware({session: (req, res) => req.session.public}):.

0 投票
0 回答
214 浏览

svelte - 在外部回调中访问组件对象?

在以下代码中,其中submit是外部 JavaScript 模块中的方法,是否可以submit()访问组件对象?

组件.html

index.js

在 Svelte 3 之前,this将是组件对象,但在 Svelte 3 中,this似乎是目标元素。

0 投票
2 回答
14517 浏览

port - 如何更改 svelte 中的默认端口 5000?

如果我们通过 degit 安装示例模板,我不知道如何将 svelte 中的默认 5000 端口更改为其他端口。

0 投票
2 回答
5264 浏览

html - 如何在 svelte 中渲染 html

我尝试通过将 html 存储在变量中来呈现 html,但它不起作用,我还尝试了三重花括号

ans3 变量的返回类型类似于“<h1>Hello</h1>”

0 投票
2 回答
1040 浏览

javascript - 在回调中访问 Svelte 组件属性?

假设您在一个组件中有很多属性:

然后,您想做一些事情,例如从外部回调中更新所有这些,就像在另一个库中一样(即不是也不能是 Svelte 组件本身的东西)。

一个简单的用例只是一个加载一堆数据的 AJAX 方法(假设这个 ajax 函数有效并且你可以给它传递一个回调):

这行得通,但它是令人难以置信的样板。我真正想要的是一种遍历所有属性的方法,以便可以以编程方式分配它们,尤其是在没有外部库/回调部分的先验知识的情况下。

有没有办法访问 Svelte 组件及其属性,以便您可以循环访问它们并从外部函数分配它们?

Vue 有一个简单的解决方案,因为你可以传递组件,并且仍然检查并分配给它的属性:

我已经看到了一些解决方案,但它们都已经过时了——它们都不适用于 Svelte 3。

抱歉,如果以前有人问过这个问题。我花了几天时间试图弄清楚这一点以避免所有额外的样板文件,而我能找到的最接近的是外部回调中的访问组件对象?现在没有答案。

0 投票
0 回答
323 浏览

javascript - 将 d3-cloud 与 rollup 集成(实际上是 Svelte)

我有以下使用 d3-cloud 的 Svelte 3 项目。我将它包含在头端之前的 index.html 中,如下所示:

我想在我的 index.html 中删除对它的任何引用并将其包含在 npm 中,如下所示:

这就是我在 package.json 中得到的

我有一个引用 d3 和 d3.layout.cloud() 的 js 函数

我尝试在我的 index.html 中评论对 d3 的引用,然后:

尽管如此,我仍然从汇总中收到此消息:

当我运行代码时,我在浏览器控制台上收到此错误:

我也尝试将它添加到我的 rollup.config.js,但我想这不是我的意思(我不想将它作为外部资源,但捆绑在我的 bundle.js 中)

我想让汇总处理我的前端依赖项(如 d3 和 d3-cloud)并将它们包含在我的 bundle.js 中(我仍然不太了解如何使用捆绑程序来处理前端依赖项)

我该怎么做?