问题标签 [stimulusjs]

I have button with a masked number phone :

I would like to reveal the number phone but that the toogle work only once (no return)

My stimulus-controller :

I'm trying two methods :

With a toggle function :

With show and hide functions :

The two methods works fine but I would like that the user can switch only once

使用 Haml，ruby 2.7.2，rails 6.1.2.1，刺激 ^2.0.0

所以，我使用了一个显示选择类型的嵌套表单。根据选择类型的值，我将显示或隐藏div。我正在将我的咖啡脚本转换为刺激，但我不确定如何强制触发更改事件，或者只是运行检查select值的代码来决定是否应该隐藏或显示div。过去，在我的 html.haml 视图中，我会这样称呼：

基于此处的另一篇文章：https://discuss.hotwire.dev/t/triggering-turbo-frame-with-js/1622，我尝试将其更改为：

那没有用。也许还有另一种方法可以做到这一点，或者我使用错误的词汇来查找我想要做的例子？我宁愿手动执行 Controller#action 并给它选择对象以立即工作，但我不确定如何在 html/ script标签中执行此操作。谢谢你的帮助！

这是我的相关代码，应该有所帮助： _question_fields.html.haml

nested_form_controller.js

这是嵌套表单的示例 .gif，如下所示：

1. 我添加一个问题
2. 我从select标记中选择一个选项，该选项会触发 select → change 事件：nested-form#update_q_type
3. 如果我选择Option或Checkbox，那么我会显示div，否则我会隐藏div

现在，这就是我尝试触发 select → change 事件的原因。如果我再次开始编辑此记录，它会很好地加载数据。但是，它不知道何时显示答案div。这就是为什么我需要触发 select → change 事件，以便它可以正确设置答案div以隐藏或显示。否则，它默认始终“隐藏”。

我在下面还有另一个 .gif。如您所见，它加载了选择选项的选择。如果我再次尝试选择选项，它不会做任何事情......因为它并没有真正改变。如果我将其更改为Checkbox，它当然会更新。所以基本上，我需要做这个onLoad，你可以说。

也许有不同的方法可以做到这一点？谢谢您的帮助！

更新：我没有意识到我的 html 标签被解释为 html。哎呀。将所有标签更改为斜体字。例如： '/</select/>/' 现在只是select。我还扩展了该问题以进行更多说明。

我在使用stimulus.js 定位css 属性时遇到问题

我想在单击图标时将显示 flex 切换为 none 和 flex

#css

#hide_controller

#html

错误信息

我在哪里添加课程？谢谢

所以我有这种情况，我有一个默认隐藏的列表，当你点击一个按钮时，它会切换可见性。

这是我的控制器

这工作得很好。

但是，在可折叠列表中，我还有其他可折叠项目。

这就是我想要实现的

这是代码

使用当前的实现，当我单击显示时，两个可折叠项都会显示

我还在学习stimulus.js，我正在尝试扩展关于stimulusJS 和FullCalendar 的DriftingRuby 集。在该教程中，表单提交了一个普通的 http put 请求并重新加载了页面。我想允许用户使用 UJS/Stimulus 管理事件，而不需要重新加载页面。

这是我的 calendar_controller.js

我需要add_event在 connect() 生命周期回调中调用该方法。当我学习 Stimulus.js 时，我很难找到有人试图做类似事情的例子。

是否可以从 connect() 方法外部调用该add_event方法？

所以，我有一个安装了 webpacker、vue、turbolinks 和刺激 js 的 Rails 应用程序。
我遇到的问题是，即使控制器只导入一次，即使我暂时禁用 turbolinksinitialize()功能以及connect()一个被调用两次的功能。
仅当我进行刷新时才会发生这种情况（即，不是在我第一次访问该页面时，而是仅在我执行页面重新加载时）。
奇怪的disconnect()是只被调用一次（当我离开页面时）

这很糟糕，因为我需要在初始化时修改 DOM，所以我添加了两次元素。有人对导致这种情况的原因和/或解决方案有任何线索吗？

编辑：application.js 按要求

组件/index.js

控制器/index.js

在每个文件中，如果我console.log只记录一次......
仅在刺激控制器中initialize或connect打印两次

这只发生在我重新加载页面时，而不是当我第一次访问它时。

我为响应式侧边栏编写了代码。菜单关闭按钮有效，但打开按钮无效。

在分配任务时，我必须在 Stimulus 的帮助下写下这一切

HTML 写在 application.html 文件中

用 sidebar_controller.js 编写的 js 代码

这是屏幕截图。关闭按钮有效，但菜单打开按钮无效。我哪里做错了？问题出在 sidebar_controller.js 或 application.html 中的代码中吗？

请帮帮我。

我正在连接一个松弛的克隆（html/css）并拥有它，以便在我单击 x 时打开/关闭参考抽屉。我还想从导航区域打开/关闭它，并认为我可以采用相同的 link_to 并从页面的不同部分调用它。

但是当我这样做时，如果我从不同的目标中调用它，我会收到一个错误

如何使用数据目标中的代码来触发不同的数据目标？

即我想要工作的是

--navigation partial (link_to 不工作) --

-- 应用程序部分（link_to 有效） --

不知道我哪里出错了。我想只要被引用的目标是唯一的并且在页面上它应该从哪里调用它并不重要？

商务课程

喜欢上课

用户类

业务/show.html.erb

我需要帮助来设置 likeReflex 控制器。我希望登录用户喜欢业务并将它们添加到他们的 user.likes

我开始在我的 Rails 应用程序中使用Hotwire，并实现了类似于教程视频的内容，其中提交了表单并刷新了页面的另一部分。就像在视频中一样，我必须实现自己的重置表单控制器：

重置表单中的值。表单看起来像：

在按钮中生成如下：

因为有一个data-disable-with，当你按下按钮时，它会被禁用以避免双击提交，这很棒。问题是它this.element.reset()不会重置它。

处理这个问题的正确方法是什么？

我不是在寻找解决方法，我知道很多，但我正在寻找解决这个问题的干净解决方案。

这是由 UJS 引起的按钮的禁用吗？这是否意味着不应在 Stimulus 应用程序中使用 UJS？

reset我可以从JavaScript 函数重新启用按钮，但如果输入按钮是这样指定的：

value然后按钮的原始标签 (完全重新加载页面。

我可以扔：

并使用刺激控制器实现我自己的双击预防，但这感觉不对。问题不在于属性data-disable-with，而在于它是如何实现的。