在Phoenix LiveView Native（beta1）中创建可点击按钮遇问题

你的代码存在两个核心问题：

• <Button />使用了自闭合标签，导致"Sign Up"文本不属于按钮的可点击区域，按钮实际没有可交互的内容
• 没有绑定LiveView的事件处理逻辑，点击按钮不会触发任何操作

以下是修复后的完整代码：

defmodule MyApp.HomeLive do
  use MyApp, :live_view
  use MyApp.HomeStyles

  def render(%{format: :swiftui} = assigns) do
    ~SWIFTUI"""
    <VStack class="">
      <Button phx-click="sign_up">
        Sign Up
      </Button>
    </VStack>
    """
  end

  # 处理按钮点击事件
  def handle_event("sign_up", _params, socket) do
    # 在这里添加你的业务逻辑，比如跳转注册页面、提交表单等
    {:noreply, socket}
  end
end

关键修改点说明：

• 将"Sign Up"文本嵌套在<Button>标签内部，确保文本属于按钮的可点击区域
• 通过phx-click属性绑定LiveView事件名（示例中为"sign_up"）
• 实现handle_event/3函数来响应点击事件，编写具体的业务逻辑

如果需要应用自定义样式（比如你引入的HomeStyles），可以给按钮添加class属性：

~SWIFTUI"""
<VStack class="">
  <Button phx-click="sign_up" class={@styles.sign_up_button}>
    Sign Up
  </Button>
</VStack>
"""

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