如何在Rails视图组件中传递哈希数据？解决变量未定义报错

错误原因 #

1. 你在组件类中定义的student_details是局部变量，作用域仅局限于类定义的代码块内，视图模板无法访问到这个变量。
2. Ruby原生哈希不能通过.student_id这类点语法访问键值，必须使用键索引（如hash[:key]），或者将哈希转换为可通过点语法访问的对象。

解决方案 #

方案1：使用实例变量+哈希键索引 #

修改component.rb，把student_details改为实例变量（以@开头），让视图可以访问：

module Shared
  module Student
    class Component < ViewComponent::Base
      def initialize(title:)
        @title = title
        # 定义为实例变量，扩展作用域到视图模板
        @student_details = {name: "John Doe", course: "Rails Development", student_id: "1"}
      end
    end
  end
end

修改component.html.erb，用哈希键索引取值：

<div class="font-montserrat flex flex-col bg-white text-shadow-none">  
  <%= @student_details[:student_id] %>
  <%= @student_details[:name] %>
  <%= @student_details[:course] %>
</div>

方案2：使用OpenStruct实现点语法访问 #

如果偏好使用.student_id这类点语法，可以把哈希转换为OpenStruct对象：
修改component.rb：

# 引入Ruby标准库OpenStruct
require 'ostruct'

module Shared
  module Student
    class Component < ViewComponent::Base
      def initialize(title:)
        @title = title
        # 将哈希转为OpenStruct，支持点语法访问属性
        @student_details = OpenStruct.new(
          name: "John Doe", 
          course: "Rails Development", 
          student_id: "1"
        )
      end
    end
  end
end

视图代码保持你原来的写法即可：

<div class="font-montserrat flex flex-col bg-white text-shadow-none">  
  <%= @student_details.student_id %>
  <%= @student_details.name %>
  <%= @student_details.course %>
</div>

方案3：定义实例方法返回数据（适合复杂逻辑） #

如果student_details需要动态生成或包含复杂逻辑，可定义实例方法：

# 若要用点语法，需引入OpenStruct
# require 'ostruct'

module Shared
  module Student
    class Component < ViewComponent::Base
      def initialize(title:)
        @title = title
      end

      def student_details
        # 返回哈希或OpenStruct对象
        {name: "John Doe", course: "Rails Development", student_id: "1"}
        # 若用点语法则返回OpenStruct：
        # OpenStruct.new(name: "John Doe", course: "Rails Development", student_id: "1")
      end
    end
  end
end

视图中直接调用方法取值：

<div class="font-montserrat flex flex-col bg-white text-shadow-none">  
  <!-- 哈希用键索引 -->
  <%= student_details[:student_id] %>
  <%= student_details[:name] %>
  <%= student_details[:course] %>

  <!-- 若返回OpenStruct则用点语法 -->
  <%#= student_details.student_id %>
  <%#= student_details.name %>
  <%#= student_details.course %>
</div>

内容的提问来源于stack exchange，提问作者Fuaad