问题标签 [lit-element]

将（内部）属性更改传递给（外部）观察到的属性的目的和用途是什么？如果可能，请举一个外向的例子。

蒂亚

在 lit-element 组件中，我正在学习如何写入 Firebase 文档。

我将数据库引用设置为构造函数常量（docRef）......因为它看起来是个好地方。但是，我无法从 writeToDb() 方法中调用它。在下面的代码中，一切正常，但您可以看到我重复了 refDoc (=refDoc2)。

我尝试过“this.refDoc”，但出现错误：无法读取未定义的属性“集”。在这种情况下，你如何做类似的事情？

谢谢你的帮助！

我正在使用 LitElement 创建一个 Web 组件。这是来自https://lit-element.polymer-project.org/guide/start

如何在没有 Shadow DOM 的情况下创建 LitElement？

我想在没有#shadow-root 的情况下在这里创建它：

有没有办法在 Lit-Element/Polymer 中创建自定义事件，例如鼠标悬停事件？我一直在寻找这个，但我似乎可以找到一种方法。我知道 Lit-Element 中的事件，例如 @click，但对鼠标悬停事件一无所知。

我有两个 4 dropdowns，第二个dropdown被选中，如果我选择 first dropdown， seconddropdown填充值但首先显示最后一个元素而不是 first

例如：

有哪些方法可以对 lit-element mixin 进行单元测试？我有一个简单的 mixin，它只修改firstUpdated了 lit-element 的生命周期事件：

所以基本上，用法是：

我不太确定如何为此处理单元测试。

更新

我可能会创建一个扩展 mixin 的测试元素，即 ie MyElement，然后测试元素的 firstUpdated 函数。这是测试这个的唯一方法还是有更好的方法来做到这一点？

任何人都有一个很好的设置来测试用 jest、jsdom 或类似的自定义元素？我一直在使用 Puppeteer 和 Selenium，但它们太慢了测试运行速度。jsdom 的任何其他替代方案或修复程序可以使以下测试可运行吗？

使用测试文件：

最后这是当前的 jest 环境设置：

问题：有没有办法在不触发其功能的情况下将属性更改传播到子元素render？目前，当我更新父级中的属性时，switchViewModeHandler它会触发对子级的重新渲染。

用例：将父级切换到“编辑”模式也应该为其所有子级切换相同。

疑问：我应该使用自定义事件吗？问题是它将是一个复杂的嵌套元素网络，其中的事件很快就会变得难以调试（Polymer 已经遇到过这个问题）。

设置：父元素：

子元素：

标记：

编辑模式来自一个导入的简单枚举（此处省略）：

这是一个可以玩的 Codesandbox：https ://codesandbox.io/s/v1988qmn75

我想静态地服务一个项目，它使用 webcomponents（使用 lit-html），没有任何打包工具，如 webpack 等。

示例项目由以下结构组成：

package.json：

app.js：

最后，index.html：

我使用静态 http 服务器来提供服务，当然，这不起作用。浏览器引发错误：Error resolving module specifier: lit-element.

因此，我们尝试将import指令更改为：

import { LitElement, html } from './node_modules/lit-element/lit-element.js';

然后浏览器失败：Error resolving module specifier: lit-html在lit-element.ts:14:29

我尝试使用经过以下修改的systemjs版本3.0.1index.html

和一个systemjs.map.json文件：

当加载这个（再次通过静态网络服务器）时，我们进入 Firefox：

import declarations may only appear at top level of a module在app.js:1.

在 Chrome 中： Uncaught SyntaxError: Unexpected token {在app.js:1

在 Safari 中： Unexpected token '{'. import call expects exactly one argument.在app.js:1

所有这些都表明它systemjs没有被app.js视为一个模块。

无论如何，我们可以实现对具有依赖关系树的模块的静态加载node_modules吗？

我已将代码版本推systemjs送到https://github.com/dazraf/lit-test。

谢谢。

我是 lit-element 的新手，我想使用 litelement 创建一个模态组件，模态应该在页面加载时显示并在 20 秒后自动关闭。
这是我的代码片段：