How to upload the pictures by create_signal?

[callmeitachi]

[gbj]

I'm sorry, I do not understand what the title means and the body of the message is just a blank image.

[callmeitachi]

Sorry,i'm not very good at English.I want to uplaod the pictures,but i don't know how to use the input event.The browser show "You are setting a NodeRef that has already been filled. It’s possible this is intentional, but it’s also possible that you’re accidentally using the same NodeRef for multiple _ref attributes.".How to solve it?

[gbj]

Can you show some code that you're trying?

[callmeitachi]

I have the following code:
let (remain1,set_remain1)=create_signal("no".to_string());
let input_element:NodeRefhtml::Input=create_node_ref();
view! {
<input type="file" value=remain1 name="remain1" node_ref=input_element on:input=move |ev| {
set_remain1.set(event_target_value(&ev));
logging::log!("{}",remain1.get());
} prop:value=remain1 />
}
How do i get the value and set it?

[gbj]

First, make sure you enable the FileList API on web-sys in Cargo.toml

[dependencies]
web-sys = { version = "0.3", features = ["FileList"] }

Here is how you get a web_sys::FileList from an <input type="file">:

    view! {
        <input
            type="file"
            name="remain1"
            on:input=move |ev| {
                let files = ev.target().unwrap().unchecked_ref::<web_sys::HtmlInputElement>().files().unwrap();
                web_sys::console::log_1(&files);
            }
        />
    }

Note that as soon as you're in the event listener here, Leptos isn't providing any helper functions. This is just using the plain web-sys APIs.

Now you can do whatever you want with the FileList.