Created
April 11, 2020 11:29
-
-
Save haha861924/daf4b98e5c1d2300a7e6f74deb3179e3 to your computer and use it in GitHub Desktop.
JS Bin // source https://jsbin.com/dolibun
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<meta name="viewport" content="width=device-width"> | |
<title>JS Bin</title> | |
</head> | |
<body> | |
<div id="app"> | |
<h4>清單</h4> | |
<input type="text" placeholder="請新增清單內容.." | |
v-model="newTodo" @keyup.enter="addTodo(newTodo)" > | |
<br> | |
<ul> | |
<li v-for="todo in todos" > | |
{{todo.content}} - | |
<a href="#" @click="removeTodo(todo)"> | |
刪除</a> | |
</li> | |
</ul> | |
</div> | |
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> | |
<script id="jsbin-javascript"> | |
var app = new Vue({ | |
el:'#app', | |
data:{ | |
todos:[], | |
newtodo:'' | |
}, | |
methods : { | |
addTodo : function(todo){ | |
this.todos.push({content:todo,completed:false}); | |
}, | |
removeTodo : function(todo){ | |
this.todos.splice(this.todos.indexof(todo),1); | |
} | |
} | |
}) | |
</script> | |
<script id="jsbin-source-javascript" type="text/javascript">var app = new Vue({ | |
el:'#app', | |
data:{ | |
todos:[], | |
newtodo:'' | |
}, | |
methods : { | |
addTodo : function(todo){ | |
this.todos.push({content:todo,completed:false}); | |
}, | |
removeTodo : function(todo){ | |
this.todos.splice(this.todos.indexof(todo),1); | |
} | |
} | |
}) | |
</script></body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var app = new Vue({ | |
el:'#app', | |
data:{ | |
todos:[], | |
newtodo:'' | |
}, | |
methods : { | |
addTodo : function(todo){ | |
this.todos.push({content:todo,completed:false}); | |
}, | |
removeTodo : function(todo){ | |
this.todos.splice(this.todos.indexof(todo),1); | |
} | |
} | |
}) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment