Here, we will create an application using the Vue exposed reactivity API to render an animation on the screen:
- Using the base example from the 'Creating the base file' section, create a new file named reactivity.html and open it.
- In the <head> tag, add a new <meta> tag with the attribute chartset defined as "utf-8":
<meta charset="utf-8"/>
- In the <body> tag, remove the div#app HTML element, and create a div HTML element with the id defined as marathon and the style attribute defined as "font-size: 50px;":
<div
id="marathon"
style="font-size: 50px;"
>
</div>
- In the empty <script> HTML element, create the constants of the functions that will be used using the object destructuring method, calling the reactivity and watch methods from the Vue global constant:
const {
reactive,
watch,
} = Vue;
- Create a constant named mod, defined as a function, which receives two arguments...