问题标签 [glimmer.js]

是否可以将 ember-data 与 Glimmer 一起使用，还是需要完整的 ember 安装？如果是这样，可以忽略多少 Ember 核心（例如，只使用组件，不使用路由器等）？

此外，如果不可能，是否有一个库可以提供与 Glimmer 兼容的 JSONAPI 实现？

我已经

我将一些文件的扩展名从 js 更改为 ts。一切正常；D

我找不到添加新类型的示例。可能是不知道我应该使用的正确搜索关键字的问题。

所以，如果我有：

我在哪里定义类型Foobar？它是我必须在某处创建的文件吗？

这是我第一次使用 Glimmer。它非常酷，我只是喜欢使用它。话虽这么说，我不太确定为什么，但我不断收到过滤属性的未跟踪错误。我真的很感激任何建议或帮助。:)

模板

我的错误:-(

所以我最近开始研究 ember js，尤其是它的微光渲染引擎，并试图了解它是如何工作的。

所以我的理解是，Glimmer VM 是一个模拟实际 DOM 并执行功能以对其进行更新的虚拟机。虽然 vdom 维护 DOM 状态的内部表示，但 glimmer VM 没有这样的状态，相反，它执行两组线性指令 - 一组用于模板的初始渲染，第二组用于更新元素。这种方法的主要好处是，这样我们可以完全绕过 JS 的解析/编译瓶颈，只需将二进制文件发送到客户端，然后由 glimmer vm 执行。我做对了吗？

-- 当一个 ember 并发任务被称为 glimmer components getter 时，它会无限循环运行。

用户表.hbs

上面的组件在模板中的某处被调用并传递帐户和页面动态。

注意：它在无限循环中运行。

在过去的三年里，我一直在使用 react，只是看了一些关于 ember 和 glimmer 的演讲，并对 glimmer 产生了兴趣。如果这个问题没有意义，请原谅我的无知。

什么相当于global state / context微光应用程序中的 a？我正在寻找的是@tracked可以在组件树中深入访问的数据，而无需argument在每个级别传递它。想想没有那些仪式的 redux action/action-creator/reducer。

一个具有一系列函数的单个全局原子，可以不可变地修改它并重新主动地查看组件树上的更改。

如何将 ember 插件转换为 Web 组件？

https://github.com/BBVAEngineering/ember-cli-web-components 这个插件不起作用，我得到了，defineCustomElements is not defined 错误。

然后我发现 glimmer 可以创建 web 组件。使用 glimmer，我需要将 ember 插件转换为 glimmer，然后创建 web 组件（这很耗时）。此外，我无法将数组和对象传递给使用 glimmer 创建的 Web 组件（只能使用属性传递字符串），并且 Web 组件没有使用 shadow dom（这可能会导致样式问题）。

Ember octane 正在使用 glimmer 组件，但在其文档中找不到是否可以转换为 Web 组件

那么目前将 ember 插件转换为 Web 组件的最佳方法是什么？

我们的业务问题陈述之一是，我们必须创建组件，以便任何消费者都可以将它们用作小部件并嵌入到他们的网站中。问题是我们已经有了用 ember 制作的那些组件。

我们不知道消费者网站将拥有哪个堆栈，这可能是随机的。所以我们想到了将这些 ember 组件转换为 web 组件。

我们做了小型 POC，我们无法使用 glimmer 从 ember 组件中创建 Web 组件。但是我们面临着几个问题

1. 我们无法使用 glimmer 将对象/数组传递给 Web 组件（我们尝试使用通过属性传递它）
2. 当 web 组件被渲染时，shadow DOM 不工作

为了使用简单的微光组件，我遵循了https://glimmerjs.com/guides/using-glimmer-as-web-components

我正在 Ember 中构建我的第一个 Glimmer 组件，我的模板中有这样的内容：

然后我制作了一个相应的.js组件文件，并认为我会尝试从 HTML 中删除长路径。

我的第一次尝试是做一个吸气剂：

现在使用模板：

这最初有效并显示分配给变量的起始值val，但当底层val更改时它不会更新。

所以我想我会尝试将吸气剂标记为已跟踪，但这会使输出消失：

然后我尝试了这个，但它不是有效的语法：

那么在 Glimmer 组件中应该如何处理呢？

当然，解决方案不是让 HTML 每次引用变量时都引用这样的深层路径，但是新的 Ember 文档，尽管它们很好，但在这个相对简单/常见的情况下，我一点也不聪明。

我正在努力弄清楚如何在微光组件层次结构中实现数据向下，向上操作（使用 Ember Octane，v3.15）。

我有一个带有项目列表的父组件。当用户单击Parent组件中的按钮时，我想Editor用来自相关项目的数据填充组件；当用户在组件中单击“保存”时Editor，将更改填充回父级。这是发生的事情：

如何使文本框填充“Hello”，并在单击“保存”时将更改保留回上面的列表？

代码

基本原理/问题

我决定实现Editor一个有状态的组件，因为这似乎是从<Input />组件中获取表单数据的最惯用的方式。我使用args. 由于this.currentModel是@trackedin ParentComponent，我希望重新分配该属性以更新@currentModel传递给Editor.

确实情况似乎如此，因为单击 make 中的其中一个项目旁边的“编辑”ParentComponent出现<small>Editing ID: {{this.id}}</small>。但是，既不会填充<Input />元素的值，也不会id填充 的值。

我理解这一点this.text并且this.id没有被更新，因为当父级发生更改时不会重新运行constructorof ......但我坚持要做什么。EditorComponentcurrentModel

我试过的

当我试图弄清楚这一点时，我遇到了这个示例（codeBlogAuthorComponent ），它在（hbs）和BlogAuthorEditComponent（hbs，js ）之间具有几乎相同的交互。他们的解决方案，适用于我的问题，是这样编写 EditorComponent ：

有用！但我不喜欢这个解决方案，有几个原因： - 修改传递给子组件的东西的属性arg似乎......怪异......老实说，我不确定它为什么会起作用（因为 whileParentComponent#models是@tracked，我不希望遵循该数组中 POJO 的属性...） - 这会在ParentComponent您键入时更新文本，虽然整洁，但不是我想要的 --- 我希望仅保留更改当用户点击“保存”（在这种情况下什么都不做） - 在我的真实应用程序中，当用户没有“编辑”现有项目时，我希望表单成为“添加项目”表单，点击“保存”按钮添加一个新项目。我'<Input @value

我也遇到过这个问题，但它似乎指的是旧版本的微光。

感谢您阅读这篇文章---我将不胜感激任何建议！