问题标签 [lit-html]

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 回答
2404 浏览

node.js - 如何在实时 Web 服务器上部署/使用 lit-html、lit-element

我开始尝试 lit-html 和 lit-elements,玩弄它,现在我遇到了无法找到如何在线发布此类代码的问题。从未在在线平台上使用过 Node-js 包,只使用了其中的一些代码。Normaly 我建立普通的 php/html 模板,但我想试试这个。

在本地构建一些有效的测试用例。但是到处搜索,以了解如何将这种代码在线发布到互联网上。我正在使用具有许多选项(例如 SSH)的共享主机,但不知道该怎么做才能使其正常工作,它不能像在我的服务器上运行 npm install 那样简单吗?

0 投票
1 回答
424 浏览

typescript - 如何在许多 Web 组件中共享 1 个 lit-element 实例

我有许多 Web 组件(每个组件都在自己的仓库中),并希望在它们之间共享一个 lit-element/lit-html 实例。这个想法是减少捆绑的大小。我不希望每个捆绑包中都有单独的实例

我制作了一个 lit-element 的 Webpack UMD 库(针对 IE11 转换为 ES5),然后在主应用程序 HEAD 中,我有一个指向我的 lit-element 库的脚本标记。它在 Webpack 中被标记为外部。

在我开始使用打字稿并遇到打字问题之前,这一直很好。

是否有可以自行安装的官方打字文件?我找不到一个?

0 投票
1 回答
141 浏览

polymer - Polymer 3、apollo-client、graphql 和 CommonJS 模块

亲爱的,

我正在尝试使 GraphQL 与 Polymer 3(或 lit-html)一起使用

尝试使用 apollo-client(它似乎有用于聚合物元素和 lit-html 的适配器)并遇到在 Polymer 中导入 CommonJS 模块(即 module.export)的问题:

如果我错了,请纠正我,但如果 apollo-client 提供apollo-client/polymerapollo-client/lit-apollo,这应该可以以某种方式工作。我试图通过包含的指南来做到这一点,但没有成功。

0 投票
1 回答
2100 浏览

javascript - 查看 litElement 中元素的值

我有一个非常简单的元素来包装一个<input type="range">元素。来自 Polymer,我有点难以调整。我想显示范围的值。

这就是我想出的:

然后使用它:

问题:

这是正确的做法吗?lit-element 的文档清楚地说明了在更新期间,只有更改的 DOM 部分会被重新渲染。要获得此模型的性能优势,您应该将元素的模板设计为其属性的纯函数。但这是否意味着我必须 1) 设置shownValue为 fistUpdated() 2) 监听change它的事件并shownValue相应地更新?如果是这样的话,我做得对吗?或者,有没有更好的方法呢?

我有一个小故障:https ://glitch.com/~busy-sternum

0 投票
1 回答
1143 浏览

polymer - 一旦所有子元素都_实际上_更新后运行一个函数

在 lit-html 中,我们拥有在firstUpdated()渲染元素后运行一次性初始化的方法。

如果您只需要在该模板中的所有子项都更新后才需要运行一个函数怎么办?如果您的模板包含原生表单元素和自定义元素怎么办?

现在我正在做一个可怕的事情:

肯定有更好的方法吗?我意识到这很棘手,因为对于 lit-element “渲染”意味着 DOM 已完成;这并不意味着里面的所有元素都完成了然后想要做的任何初始化。

但是还是...

0 投票
1 回答
42 浏览

javascript - 跳过与嵌入元素相邻的特定模板标签的模板数组

我有一组模板:

模板数组

生成数组的代码:

和嵌入元素的代码:

但是,在呈现模板时,包含</tr>标签的模板始终没有与插入的附加注释合并。

模板渲染

我试图通过调试器来确定其基础,但没有成功。任何关于为什么的建议将不胜感激。

谢谢你。

0 投票
2 回答
1931 浏览

javascript - 带有 appendChild 的 LitElement 插槽不起作用

当我尝试在 LitElement 上的组件上附加插槽子时,它不起作用并且不接受创建它。

0 投票
1 回答
874 浏览

javascript - lit-element 中 document.getElementById('aa').innerHTML = this.value 的等价物是什么?

我正在为价格范围实现一个双滑块。当用户滑动以选择特定范围时,需要显示该值。为此,我使用了运行良好的 innerHTML。但是有一个错误说

我搜索了很多,得到的答案是,一个是如果在加载DOM之前调用的函数,另一个是在lit-html中没有使用innerHTML。请帮助我摆脱该错误。

0 投票
1 回答
380 浏览

javascript - 使用 lit-html 用 Shadow DOM 封装自定义元素的 CSS

试图使一些css仅适用于使用 Shadow DOM 的自定义元素。对于渲染,我使用lit-html.

有任何想法吗?或者其他一些方法来完成没有阴影的封装?

js

强文本

我希望在我LitComponent的样式中包含“样式”段落,font-size: 80px;而不是普通标记段落。

但实际上,当像这样附加阴影时,它根本没有渲染我的组件。

在此处输入图像描述

0 投票
1 回答
732 浏览

javascript - JavaScript:我无法导入任何东西

如何在我的代码中导入 lit-html?我有这个代码:

index.js文件夹中的文件js

index.html文件:

我收到这样的错误: