Function ErrorBoundary

pub fn ErrorBoundary<FalFn, Fal, Chil>(
    props: ErrorBoundaryProps<FalFn, Fal, Chil>,
) -> impl IntoView
where FalFn: FnMut(ArcRwSignal<Errors>) -> Fal + Send + 'static, Fal: IntoView + Send + 'static, Chil: IntoView + Send + 'static,
Expand description

When you render a Result<_, _> in your view, in the Err case it will render nothing, and search up through the view tree for an <ErrorBoundary/>. This component lets you define a fallback that should be rendered in that error case, allowing you to handle errors within a section of the interface.

#[component]
pub fn ErrorBoundaryExample() -> impl IntoView {
  let (value, set_value) = signal(Ok(0));
  let on_input =
    move |ev| set_value.set(event_target_value(&ev).parse::<i32>());

  view! {
    <input type="text" on:input=on_input/>
    <ErrorBoundary
      fallback=move |_| view! { <p class="error">"Enter a valid number."</p>}
    >
      <p>"Value is: " {move || value.get()}</p>
    </ErrorBoundary>
  }
}

§Beginner’s Tip: ErrorBoundary Requires Your Error To Implement std::error::Error.

ErrorBoundary requires your Result<T,E> to implement IntoView. Result<T,E> only implements IntoView if E implements std::error::Error. So, for instance, if you pass a Result<T,String> where T implements IntoView and attempt to render the error for the purposes of ErrorBoundary you’ll get a compiler error like this.

ⓘ
error[E0599]: the method `into_view` exists for enum `Result<ViewableLoginFlow, String>`, but its trait bounds were not satisfied
   --> src/login.rs:229:32
    |
229 |                     err => err.into_view(),
    |                                ^^^^^^^^^ method cannot be called on `Result<ViewableLoginFlow, String>` due to unsatisfied trait bounds
    |
    = note: the following trait bounds were not satisfied:
            `<&Result<ViewableLoginFlow, std::string::String> as FnOnce<()>>::Output = _`
            which is required by `&Result<ViewableLoginFlow, std::string::String>: leptos::IntoView`
   ... more notes here ...

For more information about how to easily implement Error see thiserror

§Required Props

  • children: TypedChildren<Chil>
    • The elements that will be rendered, which may include one or more Result<_> types.
  • fallback: [FalFn]
    • A fallback that will be shown if an error occurs.