Advent Of Vue is a series of 24 Vue coding challenges that are sent out every day from December 1 to December 24 via a dedicated newsletter. If you'd like to receive more of these puzzles in the future, go ahead and sign up!
It's time to gift presents! And every present needs a label. So let's create our own gift label!
- Make the static
TO
andFROM
fields dynamic so we can enter custom names. - Below the label, add two input fields with two-way binding for the
TO
andFROM
fields. - When entering data into the input fields, the
TO
andFROM
fields should dynamically update. - Hint: you can look at the
./src/App.spec.js
file to see a specification of the desired outcome. - Hint: you can run the tests with
npm run test
to see if your solution matches the specification.
https://aov-gift-label.netlify.app/
This challenge was created by Markus Oberlehner.
If you like how, in this example, you can check your implementation with an existing test, you might be interested in my book/newsletter about how to write good tests for Vue applications.
Based on a Stackblitz project by tony19