JSFiddle - React, Tailwind, and code Playground

by realdev

HTML

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

<div id="app">
  <p> {{ a }}</p>  
  <!-- <p> {{ b }}</p>   -->
</div>

JavaScript

// 컴포넌트를 사용한 작성방법
Vue.component('todo-item', {
	//template: '<li>할일 항목 하나입니다.</lie>'
  props: ['todo'],
  template: '<li>{{ todo.text }}</li>'
})

new Vue({
	el:'#app',
  data: {
    todos: [
    	  { id:0, text: 'Javascript 배우기'},
        { id:1, text: 'Vue 배우기'},
        { id:2, text: '무언가 멋진 것을 만들기'},
    ]
  }
})