vue js error pada tutorial todo list

<a href='https://www.youtube.com/watch?v=PefWRVmprWU '>https://www.youtube.com/watch?v=PefWRVmprWU </a>

saat tutor todo list vue js.. di akhir kog ane nemu error ya..? kalau data dari data base 0 , saat kita mau input data dari front end > vue js error. salahnya dimana..?

index.php

<div id="wrap-todo" class="col-xs-12">
		<div class="no-todo-li" v-if="!todos.length">
		<h1>Hey There ! ayam using watsap</h1>
		<h3>Create something, Do something </h3>
		<br>
		<h5>Sekolah koding | belajar vue js</h5>
	</div>

		<div v-bind:class="{'completed': (typeof todo.done === 'string') ? parseInt(todo.done) : todo.done }" class="todo-li" v-for="todo in todos">
			{{ todo.nama }}
			<ul class="act">
				<h6><i class="fa fa-arrows"></i> Move</h6>
				<h6><i class="fa fa-pencil"></i> Edit</h6>
				<h6 v-on:click="removeTodo($index, todo.id_date)"><i class="fa fa-close"></i> Delete</h6>
				<button v-on:click="doneTodo(todo)"><i class="fa fa-check"></i></button>
			</ul>
		</div>
		<div id="icli">
			<input type="text" v-model="newTodo" @keyup.enter="addTodo" placeholder="Create Something..">
		</div>
	</div>

api/inedx.php

<?php

header ('Content-Type: application/json');
include "init.php";

//conditions
switch ($request) {
	case 'GET':
		$sql = "SELECT * FROM todo";
		$result = mysqli_query($dbConnect, $sql);

		if(mysqli_num_rows($result) > 0)
			echo json_encode(mysqli_fetch_all($result, MYSQLI_ASSOC));
			http_response_code(200);
			die();
		break;

	case 'POST':

	//escape
		$nama  = $_POST['nama'];
		$done  = $_POST['done'];
		$date  = $_POST['date'];

		if(!isset($nama)){
			http_response_code(400);
			die();
		}else{
			$sql = "INSERT INTO todo (nama,done,id_date) VALUES ('$nama','$done','$date')";
			$result	 = mysqli_query($dbConnect,$sql);
			http_response_code(200);
			die();
		}
		break;

	case 'DELETE':

		$id_date = $_GET['id'];
		$sql = "DELETE FROM todo WHERE id_date = '$id_date'";
		$result	 = mysqli_query($dbConnect, $sql);
		http_response_code(200);
		die();
		break;

	case 'PATCH':

		$id_date = $_GET['id'];
		$done 	 = $_GET['done'];
		$sql = "UPDATE todo SET done=$done WHERE id_date = '$id_date'";
		$result	 = mysqli_query($dbConnect, $sql);
		http_response_code(200);
		die();
		break;

	default:
		# code...
		break;
 }

?>

mainvue.js

/**
===========================================
* VUE JS TO DO LIST
===========================================
*/
new Vue({

	el: "#wrap-todo",
	data:{
		newTodo: '',
		todos: [],
		done: false
	},
	methods:{
		addTodo: function(){
			///add data
			var newItem = this.newTodo.trim()
			if(newItem){
			this.todos.push({ nama: newItem, done:false })
			this.newTodo = ''
			}
			this.$http({
				url: 'api/index.php',
				method: 'POST',
				body:{
					nama : newItem,
					done : false,
					date : Date.now()
				}
			}).then((response) => {
				console.log(response)
			});
	  	},
	  	removeTodo: function(index, id_date){
	  		this.todos.splice(index,1)
	  		this.$http({
	  			url : 'api/index.php?id=' + id_date,
	  			method: 'DELETE'
	  		}).then((response) =>{
	  			//@
	  		})
	  	},
	  	doneTodo: function(todo){

	  		(todo.done == 0 ) ? todo.done = false : true
	  		todo.done = !todo.done

	  		this.$http({
	  			url : 'api/index.php?id=' + todo.id_date + '&done=' + todo.done,
	  			method: 'PATCH'
	  		}).then((response) =>{
	  			//@
	  		})
	  	}
	},
	ready: function(){
	  		this.$http({
	  			url: 'api/index.php',
	  			method: 'GET',
	  		}).then((response) =>{
	  			//console.log(response)
	  			this.todos = response.data
	  		});
	  	}

});
Vue.http.options.emulateJSON = true;