mirror of
https://github.com/leptos-rs/leptos
synced 2024-11-10 06:44:17 +00:00
examples: fix fetch example (#1096)
This commit is contained in:
parent
40363df4a1
commit
20682e63ef
1 changed files with 9 additions and 4 deletions
|
@ -17,7 +17,9 @@ pub enum FetchError {
|
|||
Json,
|
||||
}
|
||||
|
||||
async fn fetch_cats(count: u32) -> Result<Vec<String>, FetchError> {
|
||||
type CatCount = usize;
|
||||
|
||||
async fn fetch_cats(count: CatCount) -> Result<Vec<String>, FetchError> {
|
||||
if count > 0 {
|
||||
// make the request
|
||||
let res = reqwasm::http::Request::get(&format!(
|
||||
|
@ -32,6 +34,7 @@ async fn fetch_cats(count: u32) -> Result<Vec<String>, FetchError> {
|
|||
.map_err(|_| FetchError::Json)?
|
||||
// extract the URL field for each cat
|
||||
.into_iter()
|
||||
.take(count)
|
||||
.map(|cat| cat.url)
|
||||
.collect::<Vec<_>>();
|
||||
Ok(res)
|
||||
|
@ -41,7 +44,7 @@ async fn fetch_cats(count: u32) -> Result<Vec<String>, FetchError> {
|
|||
}
|
||||
|
||||
pub fn fetch_example(cx: Scope) -> impl IntoView {
|
||||
let (cat_count, set_cat_count) = create_signal::<u32>(cx, 0);
|
||||
let (cat_count, set_cat_count) = create_signal::<CatCount>(cx, 0);
|
||||
|
||||
// we use local_resource here because
|
||||
// 1) our error type isn't serializable/deserializable
|
||||
|
@ -75,7 +78,7 @@ pub fn fetch_example(cx: Scope) -> impl IntoView {
|
|||
cats.read(cx).map(|data| {
|
||||
data.map(|data| {
|
||||
data.iter()
|
||||
.map(|s| view! { cx, <span>{s}</span> })
|
||||
.map(|s| view! { cx, <p><img src={s}/></p> })
|
||||
.collect_view(cx)
|
||||
})
|
||||
})
|
||||
|
@ -89,7 +92,7 @@ pub fn fetch_example(cx: Scope) -> impl IntoView {
|
|||
type="number"
|
||||
prop:value=move || cat_count.get().to_string()
|
||||
on:input=move |ev| {
|
||||
let val = event_target_value(&ev).parse::<u32>().unwrap_or(0);
|
||||
let val = event_target_value(&ev).parse::<CatCount>().unwrap_or(0);
|
||||
set_cat_count(val);
|
||||
}
|
||||
/>
|
||||
|
@ -98,7 +101,9 @@ pub fn fetch_example(cx: Scope) -> impl IntoView {
|
|||
<Transition fallback=move || {
|
||||
view! { cx, <div>"Loading (Suspense Fallback)..."</div> }
|
||||
}>
|
||||
<div>
|
||||
{cats_view}
|
||||
</div>
|
||||
</Transition>
|
||||
</ErrorBoundary>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue