I would really appreciate a pointer on how to implement the following component.
<answer-once> <button @click="doA">A</button> <button @click="doB">B</button> <button @click="doC">C</button> </answer-once>
The idea is that the answer-once component would enforce that only one of its child buttons can be clicked. Once one of the child buttons gets clicked, the other buttons should get tagged with a CSS disabled class.
And if it’s not tricky enough, I need to enforce this behavior at the answer-once component level because I want the user facing syntax for declaring the buttons to be in template land (i.e. as close to the above code snippet as possible).
Can this be done in Vue?
Thanks for your help!