JSFiddle - React, Tailwind, and code Playground

by Bo Andersen

HTML

<script src="https://unpkg.com/vue/dist/vue.js"></script>

<div id="app">
  <!-- EXERCISE 1: Make the below text input update a data property on every 
  "keyup" event. Also output the data property.
  Hint: event.target.value gives access to input value. -->
  <input type="text">
  Output: 

  <br><br>
  
  <!-- EXERCISE 2: Make the below text input update the data property from 
  exercise 1, but only when pressing the Control + Enter keys. 
  Hint: The modifier key for the Control key is named "ctrl" -->
  <input type="text">
  Output: 
  
  <br><br>
  
  <!-- EXERCISE 3: Prevent the below form from submitting. 
  Hint: Prevent the "submit" event on the form. -->
  <form action="" method="GET">
    <input type="submit" value="Submit">
  </form>
</div>

JavaScript

new Vue({
	el: '#app'
});