Code Monkey home page Code Monkey logo

Comments (2)

vi avatar vi commented on June 20, 2024

Workaround I use now:

        let somechoice_qqq = create_signal(false);
        let somechoice_www = create_signal(false);
        let somechoice_eee = create_signal(false);

        let the_choice = create_signal(SomeChoice::Qqq);

        create_effect(move || { if somechoice_qqq.get() { the_choice.set(SomeChoice::Qqq)} });
        create_effect(move || { if somechoice_www.get() { the_choice.set(SomeChoice::Www)} });
        create_effect(move || { if somechoice_eee.get() { the_choice.set(SomeChoice::Eee)} });

and using usual bind:checked=somechoice_qqq binders. It seems to work, but only in one direction.

Also for some reason bool signals for individual variants (like somechoice_qqq) only get set to true, never back to false.

from sycamore.

lukechu10 avatar lukechu10 commented on June 20, 2024

Also for some reason bool signals for individual variants (like somechoice_qqq) only get set to true, never back to

This sounds like a bug. Will need to investigate this. This might be caused by the event that we listen to for the checked being different when the input is a radio, although I'll have to do a bit more research to be sure.

Unfortunately we don't really have a good way to do this yet. What we want eventually is probably something like Svelte's bind:group. (In fact, the current bind: syntax is inspired by Svelte.)

For now, I would suggest that a more idiomatic and simpler workaround would be to use on:click event handlers to directly set the thesignal to the appropriate value. So something like:

view! {
    label { "Qqq" input(type="radio", name="somechoice", value="qqq", on:click=move |_| thesignal.set(SomeChoice::Qqq)) }
    label { "Www" input(type="radio", name="somechoice", value="www", on:click=move |_| thesignal.set(SomeChoice::Www)) } 
    label { "Eee" input(type="radio", name="somechoice", value="eee", on:click=move |_| thesignal.set(SomeChoice::Eee)) }
}

from sycamore.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.