自定义刺激反射类答案

【问题标题】：Custom stimulus reflex class自定义刺激反射类
【发布时间】：2021-01-20 23:02:51
【问题描述】：

我正在使用 Rails 6 进行一个实验项目。这个项目的目的是学习新的方法和使用新的（“ish”）技术。

简而言之，我在玩 Trailblazer 基础架构，stimulus_reflex 和 view_component 伴随着 view_component_reflex。

据我所知，StimulusReflex 和 ViewComponentReflex 期望 reflex 类驻留在 reflexes 文件夹/命名空间中。

我想要达到的目标：

将我的ViewComponentReflex 组件嵌套在Trailblazer 概念文件夹（命名空间）中。

我尝试过的：

创建了以下文件夹结构：

concepts/post/component/counter.rb

class Component::Counter < ApplicationComponent

  def initialize
    @loading = false
  end

  def loading=(new_value)
    @loading = new_value
    refresh! '#loader'
  end

  def do_expensive_action
    prevent_refresh!

    self.loading = true
    wait 20
    self.loading = false
  end

end

concepts/post/component/counter/counter.html.erb

<%= component_controller do %>
  <div id="loader">
    <% if @loading %>
      <p>Loading...</p>
    <% end %>
  </div>

  <button type="button" data-reflex="click->Component::Counter#do_expensive_action" >Load Content</button>
<% end %>

预期结果：

我希望 Rails 允许命名空间等。设置上述内容并运行示例应用程序时，出现错误：uninitialized constant Component::CounterReflex。这个类的依赖是内置在其中一个宝石中的，但我不知道在哪里可以找到它。我尝试过覆盖ViewComponentReflex 中的一些方法，但无济于事。

当我将Component::Counter 移动到components 文件夹（如this example 中所示）时，代码有效。

有没有办法使用这个堆栈重新定义/配置反射类的路由（模块）？

更新：

我的应用的 GitHub 存储库可以是 found here

点击计数器按钮时我看到的确切错误消息是：

StimulusReflex::Channel is streaming from StimulusReflex::Channel
06:48:27 log.1       | StimulusReflex::Channel#receive({"target"=>"Component::Counter#do_expensive_action", "args"=>[], "url"=>"http://krated.test/", "attrs"=>{"type"=>"button", "data-reflex"=>"click->Component::Counter#do_expensive_action", "data-key"=>"6b36d7d05b8737b0328d19bd2fff2679901b1736bb9e242b128e3b715aba6e87", "data-controller"=>"stimulus-reflex", "data-action"=>"click->stimulus-reflex#__perform", "checked"=>false, "selected"=>false, "tag_name"=>"BUTTON", "value"=>""}, "dataset"=>{"data-reflex"=>"click->Component::Counter#do_expensive_action", "data-key"=>"6b36d7d05b8737b0328d19bd2fff2679901b1736bb9e242b128e3b715aba6e87", "data-controller"=>"stimulus-reflex", "data-action"=>"click->stimulus-reflex#__perform"}, "selectors"=>[], "reflexId"=>"a091247b-d53b-4e63-ac59-78c72c4a3cb1", "permanent_attribute_name"=>"data-reflex-permanent", "params"=>{}})
06:48:27 log.1       | StimulusReflex::Channel Failed to invoke Component::Counter#do_expensive_action! http://krated.test/ uninitialized constant Component::CounterReflex /Users/hermann/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/activesupport-6.0.3.3/lib/active_support/inflector/methods.rb:284:in `const_get

【问题讨论】：

我ping了ViewComponentReflex的作者，也许他会看看。
@HermannHH 你在做什么应该“正常工作”，所以我认为开拓者是这里的问题。您使用的是哪个版本的视图组件反射，您是否在日志中看到类似“尝试在 #{component_name} 上初始化 view_component_reflex，但它不是 view_component_reflex”的错误？
@Cereal 我正在使用view_component_reflex (2.3.5)。不幸的是，我没有在我的日志文件中看到您所指的错误。
我想我找到了问题，你可能想向 github repo 提交问题。

标签： ruby-on-rails reflex stimulusjs view-components stimulus-reflex

【解决方案1】：

view_component_reflex 的 2.3.5 版本要求组件类名称以 Component 结尾。如果他们不这样做，它就会失败。见https://github.com/joshleblanc/view_component_reflex/blob/v2.3.5/lib/view_component_reflex/engine.rb#L18

所以再次尝试调用你的组件：

Component::CounterCountComponent

【讨论】：