问题标签 [polymer-3.x]

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

polymer-3.x - 在 stackblitz 中找不到包,即使它存在于 npm 网站中。那怎么安装呢?

我在 stackblitz 中为聚合物应用程序安装依赖项。它说找不到 3 个包,但它们存在于 npm 网站上。我也试过cdn。即使这样也没有用。

截图:

堆栈闪电战中的错误 npm 中已经存在的包

我还从stackblitz的这个网站安装了 CDNexternal sources

请帮助我哪里出错了。提前致谢。

0 投票
1 回答
651 浏览

polymer - 在无头浏览器中运行 polymer-3.x 测试

我想在没有浏览器弹出窗口的情况下运行测试。如图所示安装wct-headless并配置wct.config.json

执行polymer test时出现以下错误

找不到名为“headless”的 WCT 插件

包.json

我应该如何配置 wct.conf.json ?

0 投票
0 回答
158 浏览

css - 带有 visjs 的 Polymer3 元素

使用 Polymer2,我制作了一个使用vis.js 创建图形的应用程序github repo) 。

但是对于 Polymer3 和 LitElement,我很困惑如何包含 css 和 png
我发现这个讨论使用 webpack 进行打包 Import vis.js with webpack 和 repo 这里:https ://github.com/mojoaxel/vis-webpack -演示

它看起来不错,但是是否可以使用 vis.js 制作一个看起来像这张图片的 Polymer3 元素?

图像 Polymer3 visjs 元素

问题是它必须导入 /node_modules/vis/dist/vis-network.min.css 并且这个 css 在 /node_modules/vis/dist/img/network/ 中使用 png 图像

我正在寻找一种方法来导入这个 css + 它的 png。谢谢

0 投票
1 回答
1369 浏览

web-component - 如何使用聚合物发光元件?

我有一个 litElement,我需要从另一个域中使用它。我的浏览器是 Chrome,我正在使用“polymer serve”并直接导航到 es5-bundle。

点亮元素非常简单。只是一些静态文本。

当我使用'polymer build'我的条目时,HTML 页面会被编译(或转换)。我看到'custom-elements-es5-adapter.js'添加了对的引用,以及其他自定义 JavaScript。当我导航到此条目页面(在构建文件夹中)时,一切正常。但是,如果我用原始未编译版本替换该编译版本,我会在 chrome 控制台中收到错误'define is not defined'.

最终我将从另一个域调用它,并且不会用聚合物构建 HTML。(我已经尝试过跨域但它不工作)

我需要在客户端中包含哪些内容才能使用聚合物发光元件?

这是我所拥有的:

0 投票
1 回答
399 浏览

polymer - 冲洗功能总是使聚合物测试(用于 dom-if)通过

我正在为我正在使用的 polymer-3.x 元素编写测试dom-if。根据文档,我使用了flush. 但这不会评估并直接将所有测试标记为通过。

我的元素测试.html

我的元素.js

如果我删除冲洗

  • #1按预期失败。
  • #2

    无法读取 null 的属性“innerHTML”

当条件为真时,如何为 dom-if 编写测试用例?

0 投票
1 回答
471 浏览

polymer - 使用 Polymer 3 注入 HTML

我想在 Polymer 3 中的模板中添加一些 HTML 格式的文本。这个 HTML 来自一个函数(它使用“localize”从翻译文件中获取字符串),例如:

我发现这样做的唯一方法是使用某些类向模板添加一个 DIV 标记(myText 值来自函数):

...然后在 ready() 函数中,查询该元素并更改其 innerHTML 并通过用<sup>标记将其包围来替换文本(在本例中为 ®):

这行得通,但我不喜欢超时方法,因为我永远无法确定它是否会始终有效,并且您会稍有延迟地看到更改。

然而,我使用超时的原因是因为我没有找到任何生命周期事件,我确信所有元素都已呈现并且可用。例如,如果我使用 dom-if,这些元素还没有在 ready() 事件中呈现;所以我从querySelectorAll 中返回'null'。

所以我的问题是:是否有另一种方法(所以不使用超时方法)将 HTML 格式的字符串(来自函数)添加到模板中的元素?

0 投票
1 回答
102 浏览

xampp - 如何在本地网络服务器上运行 Polymer 3(将捆绑器添加到 xampp)

我正在尝试将旧的 Polymer 应用程序升级到 Polymer v3。如果我使用,几乎一切都可以正常工作polymer serve

但是我还必须使用一些 php 文件来连接到后端,这就是问题所在。

当我尝试使用 运行应用程序polymer serve时,找不到 PHP 文件,并且每当我尝试对它们发出 POST 请求时都会返回 404。

非工作示例。具有以下文件结构:

里面jsFile.js

当我尝试使用 XAMPP(虚拟主机)运行应用程序时,发出 POST 请求会返回我需要的内容,这很棒。但是像这样导入:

停止工作,因为没有捆绑器可以替换@为当前路径。不,我不能简单地将其重写为'/node_modules/@polymer/polymer/polymer-element.js'. 所有的聚合物元件都使用这个符号。我将不得不重写所有无意义的源代码。

我需要在使用 localhost(XAMPP 或任何其他服务)服务时在 php 文件上成功发布polymer serve或替换所有内部导入@

有没有人在 Polymer 3 中成功实现了与 php 文件的连接?或者任何知道一些解决方法的人,解决方案?

0 投票
1 回答
465 浏览

javascript - 将 Polymer 3 路由更改为不同的 html 页面

我正在创建一个带有登录和仪表板页面的示例 Polymer 3 应用程序。我的后端是一个简单的 JX-RS REST API。一旦我从 Web 服务获得响应,我想转到一个新的 HTML 文件(让我们说dashboard.html),而不是路由到同一页面中的不同元素。当我浏览 官方网站时,我真的不明白如何进行,因为我是 JS 本身的初学者。

在我的index.html,我有<my-login>,在响应之后,handlePositiveResponse被称为。这是我改变路线的地方。请在下面找到方法。

以下是我的代码: login.js

如果您能提供建议,将不胜感激如何路由到新的 html 页面。

0 投票
1 回答
322 浏览

polymer - 为什么 NPM 在聚合物元素中安装另一个 node_modules 文件夹,如何解决?

问题

我正在关注“使用 App Toolbox 构建应用程序”教程。我遇到了第 3 步“添加一些元素”的问题,一旦我尝试添加paper-checkbox元素,视图就不会显示。

经过一些试验和错误,我发现node_modules文件夹中有一个额外的文件paper-checkbox夹。这导致视图中断,因此不显示(更多内容见下文)。为什么会发生这种情况,如何解决?

教程链接

https://www.polymer-project.org/3.0/start/toolbox/add-elements

完整的问题详细信息

我使用命令行界面启动项目,按照教程说明运行polymer init并选择。polymer-3-starter-kit我运行以下命令进行安装paper-checkbox

请注意,我在安装元素后收到以下警告:

我检查了我的node_modules文件夹,我可以看到它paper-checkbox已安装。

到目前为止,当我加载my-new-view它时显示正确,如下所示: 在此处输入图像描述

my-new-view.js但是,当我在paper-checkbox元素 内部添加 import 语句时,import '@polymer/paper-checkbox/paper-checkbox.js';视图无法显示:

在此处输入图像描述

在与另一个项目进行一些代码比较后,我看到paper-checkbox文件夹不匹配(见下面的截图)。它包含一个重复的node_modules文件夹,其中包含一个重复的@polymer文件夹。该聚合物文件夹包含font-robota和其他已包含在顶级聚合物目录中的模块;甚至更多重复的内容。

在此处输入图像描述

此外,在检查网页时,控制台(在 chrome 上)给出以下错误:

由于存在重复内容,因此会发生此错误。为了解决这个问题,我只是删除node_modules了复选框元素中的文件夹。

我也尝试安装paper-inputpaper-input需要iron-input. 运行npm install @polymer/paper-input相同的node_modules文件夹后,铁和纸输入元素中都安装了。我删除了这两个文件夹,然后该元素终于起作用了。

为什么 npm 会这样做?我该如何解决?

Github 项目回购

https://github.com/starkindustries/my-first-polymer-app

版本信息

  • Git 版本 2.17.1 (Apple Git-112)
  • NPM 版本 6.4.1
  • 节点版本 v10.10.0
  • 聚合物 CLI 版本 1.8.0
  • Chrome 版本 69.0.3497.100(官方版本)(64 位)
0 投票
1 回答
656 浏览

polymer - 如何在 Polymer 3 中通过 ajax 提交铁形式

问题

我想在 Polymer 3 中提交一个铁表格。我使用一个纸质按钮,表格必须通过铁 ajax 提交。

这是我的view.js

单击纸张按钮时未提交我的表单。

我试过的

  • 我手动创建了一个 iron-ajax 元素并使用 generateRequest(). 那行得通。
  • 我在submitHandler函数中设置了警报。显示出来了。
  • 我尝试使用 提交表单this.$.formOne.submit()。这也奏效了。当然,表单不是通过 ajax 提交的,而是打开了 api 页面。
  • 我创建了一个正常<button>的提交表单。这可行,也可以通过 ajax 发送表单,但我想使用纸质按钮。

非常感谢任何帮助。谢谢!