问题标签 [stimulusjs]

我正在使用 StimulusJS + Stimulus Reflex，它正在开发中。当我部署到生产（数字海洋）时，connected() 方法不会被触发。执行 ReflexClass 并在服务器端更新 ActiveRecord 但不触发 JS 控制器。this.stimulate() 它已成功触发，因为我可以看到页面已用新数据刷新。

你能帮助我吗？我不知道在哪里看。我正在使用 Cloudflare，如果重要，请设计。

视图.html

头.html

配置/环境/production.rb

配置/cable.yml

应用程序/频道/application_cable/connection.rb

NGNIX（由 Coud66 管理）

问题在打字稿中，如果您想使用已经具有 DOM 属性的 DOM 元素，您应该如何声明这些属性以指定打字稿应该允许它们？

由 DOM 定义ondragstart的示例draggable

背景

我使用 Typescript 编写的 Stimulus 进行了一些拖放操作。我的实现在浏览器中工作，看起来 Rails webpacker6.0.3在开发模式下没有抱怨（Rails），但是当它编译资产（be rake assets:precompile）时，我得到了这些打字稿错误。

请记住，我是 Typescript 的新手。

我认为问题在于 Typescript 不知道 HTML5 拖放的 DOM 实现中有些东西是原生的（如 properties draggable、ondragstart等）。而在我的event它不喜欢dropEffect。也许event（即Event）的类型应该是另一个子类Event

我在这里做错了什么？任何帮助，将不胜感激。

错误

这两个都作为原生 HTML5 属性存在，但我想只在支持 HTML5 的浏览器上？也许我的 babel 设置在这里太严格了？

'elemenet' 来自 Stimulus

我想告诉 Typescript 我知道这些都是原生 DOM 元素的属性并允许它们

不知道为什么我得到这个。

下降效果

我的代码（用刺激编写，通过 Rails 6 中的 webpacker 编译）

我正在构建一个简单的购物车应用程序并使用 Stimulus JS 来处理 Rails 视图和 Javascript 逻辑之间的交互。

在购物车页面中，我通过在 UI 中循环显示产品，如下所示：

我正在尝试添加从购物车中删除商品的“删除”功能。我的删除逻辑工作正常，但我无法更新正确项目的数量。每次我删除一个产品时，只有第一个项目的数量会减少。

这就是我更新的方式：

this.countTarget.innerHTML = Number(this.countTarget.innerHTML)- 1;

尝试使用值和数据属性但没有运气：皱眉：

今天花了大部分时间，试图弄清楚这一点，但无法做到。关于如何解决这个问题的任何想法或建议？

谢谢！

我目前有这个简单的刺激 JS 控制器，它从 DOM 中删除一个元素

有没有办法在删除之前淡出元素？

我一直在使用 DHH 提供的演示测试 Hotwire。我有一个默认的 rails 6 设置，并且我知道它会从 rails 5 < 资产管道重新创建 javascript 文件夹结构。我遇到的问题是表单在提交后不会重置文本字段 - 尽管设置了刺激控制器以使用此特定操作。用户提交表单后，如何重置热线表单？我的代码如下

新的.html.erb

_conversation_comment.html.erb

显示.html.erb

资产/javascripts/controllers/reset_form_controller.js

免责声明：我正在使用 Webpack 4.0

因此，以下是我想在特定事件发生后添加到 HTML 中的代码：

截至目前，我能找到的唯一方法是：

我正在寻找一种通过服务器代码（阅读：Rails）呈现此模板的方法，而不是我在 JS 中对其进行硬编码。

PS：

在撰写本文时，StimulusJS 的 Discourse 已关闭，我可以找到与我在这里提出的问题类似的问题的链接：https ://discourse.stimulusjs.org/t/fetching-a-partial-on-click /1297，在 Stackoverflow 上，我找不到与此相关的问题。

我正在尝试替换我在 django 中制作的应用程序的 jquery，并且我正在尝试使用刺激 js，因为它与 turbolink 一起似乎是一个不错的选择，但是在创建数据表时遇到问题，在搜索引擎中输入文本时它正确运行并返回我写的内容，但问题出在表中，因为浏览器控制台返回一个未定义的值。这是我的html：

这是我的控制器：

我正在动态地将字段添加到我的表单中。在标准文本字段的情况下，它可以与带有<template>元素的 Rails + StimulusJS 一起正常工作。

我正在使用 MaterializeCSS 进行样式设置，如果我尝试用选择菜单做同样的事情，它会中断，而且我在 JS 代码中返回的 innerHTML 似乎与模板标签内的代码不匹配。所以我决定使用我复制的 div 代替。

视图代码（相关部分）：

这是我在 Stimulus 控制器中复制的模板。

这是 HTML 中的第一个（并且有效的）选择菜单的样子：

所以下一步是改变<ul>和两个<li>元素的ID +data-target元素来定位右选择菜单。

我最终得到的是这个 JS 代码，它确实添加了第二个具有正确样式的选择菜单，但它不可点击并且不显示选项，尽管它们存在于 HTML 标记中并且 ID 与第一个不同：

现在它看起来像这样，我不知道如何使这个东西工作：

在尝试使用 Stimulus.js 在 rails 6.1.0 中运行 RSpec 测试时，我遇到了一个问题，即我从终端获得的唯一输出

我已经通过不同的站点进行了一些搜索，但没有任何运气来运行我的测试。

我认为我必须在我的测试环境文件中添加带有我的类的代码块，但还没有任何结果。在此错误输出到控制台后，RSpec 挂起，我必须使用 Command + C 退出。不知道我是否遗漏了什么或者我搞砸了什么。

当创建一个在某个事件（例如“悬停”时）应该始终执行相同操作的 Stimulus 组件时，设置该操作的首选方式是什么？

我想写这个，例如：

代替

data-action="hover->tooltip#showTooltip"如果刺激组件的唯一要点是在悬停时显示工具提示，包括对我来说感觉非常多余。

我现在正在通过在initialize()函数中手动添加事件侦听器来执行此操作，但我不确定这是否是个好主意：