JSFiddle - React, Tailwind, and code Playground

by techyankee

HTML

<div id="app">

  
  <p>{{ text }}</p>
  <a v-if="toggle"  true v-bind:href="url">公式サイト</a>
  <ul>
    <li v-for="language in languages">{{ language }}</li>
  </ul>
  
  
  <button v-on:click="clickHandler">
    Click!!!
  </button>
  
  <p>
    <input type="text" v-model="text">
  </p>
  
</div>

<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>

JavaScript

var vm = new Vue ({

	el: '#app',
  data: {
  	text: "aaa",
  	url: "https://jp.vuejs.org/",
    toggle: true,
    languages: [
    	'English',
      'Japanese'
    ]
  },
  
  methods: {
    	clickHandler: function() {
    		this.text = 'Clicked!!!'
      }
    }
})