Data fetching

This example shows how data can be fetched with loading state and error handling.

:ruby
  def initialize
    @result = nil
    @error = nil
  end

  def mount
    @result =
      fetch("https://pokeapi.co/api/v2/pokemon/#{$id}")
      .json(symbolize_names: true)
  rescue => e
    @error = e.message
  end

%div
  = if @error
    %p.error= @error
  = elsif @result
    %pre= SyntaxTree.format(@result.inspect)
  = else
    %p Loading Pokémon with id #{$id}…

This component can be used like this:

:ruby
  Pokemon = import("./Pokemon")
%Pokemon(id=123)

Demo

Loading…