github.com/insionng/yougam@v0.0.0-20170714101924-2bc18d833463/public/libs/vue-1.0.24/examples/todomvc/index.html (about)

     1  <!doctype html>
     2  <html data-framework="vue">
     3  	<head>
     4  		<meta charset="utf-8">
     5  		<title>Vue.js • TodoMVC</title>
     6  		<link rel="stylesheet" href="node_modules/todomvc-app-css/index.css">
     7  		<style> [v-cloak] { display: none; } </style>
     8  	</head>
     9  	<body>
    10  		<section class="todoapp">
    11  			<header class="header">
    12  				<h1>todos</h1>
    13  				<input class="new-todo"
    14  					autofocus autocomplete="off"
    15  					placeholder="What needs to be done?"
    16  					v-model="newTodo"
    17  					@keyup.enter="addTodo">
    18  			</header>
    19  			<section class="main" v-show="todos.length" v-cloak>
    20  				<input class="toggle-all" type="checkbox" v-model="allDone">
    21  				<ul class="todo-list">
    22  					<li class="todo"
    23  						v-for="todo in filteredTodos"
    24  						:class="{completed: todo.completed, editing: todo == editedTodo}">
    25  						<div class="view">
    26  							<input class="toggle" type="checkbox" v-model="todo.completed">
    27  							<label @dblclick="editTodo(todo)">{{todo.title}}</label>
    28  							<button class="destroy" @click="removeTodo(todo)"></button>
    29  						</div>
    30  						<input class="edit" type="text"
    31  							v-model="todo.title"
    32  							v-todo-focus="todo == editedTodo"
    33  							@blur="doneEdit(todo)"
    34  							@keyup.enter="doneEdit(todo)"
    35  							@keyup.esc="cancelEdit(todo)">
    36  					</li>
    37  				</ul>
    38  			</section>
    39  			<footer class="footer" v-show="todos.length" v-cloak>
    40  				<span class="todo-count">
    41  					<strong v-text="remaining"></strong> {{remaining | pluralize 'item'}} left
    42  				</span>
    43  				<ul class="filters">
    44  					<li><a href="#/all" :class="{selected: visibility == 'all'}">All</a></li>
    45  					<li><a href="#/active" :class="{selected: visibility == 'active'}">Active</a></li>
    46  					<li><a href="#/completed" :class="{selected: visibility == 'completed'}">Completed</a></li>
    47  				</ul>
    48  				<button class="clear-completed" @click="removeCompleted" v-show="todos.length > remaining">
    49  					Clear completed
    50  				</button>
    51  			</footer>
    52  		</section>
    53  		<footer class="info">
    54  			<p>Double-click to edit a todo</p>
    55  			<p>Written by <a href="http://evanyou.me">Evan You</a></p>
    56  			<p>Part of <a href="http://todomvc.com">TodoMVC</a></p>
    57  		</footer>
    58  
    59  		<!-- testing/benchmark only -->
    60  		<script>
    61  		var isPhantom = navigator.userAgent.indexOf('PhantomJS') > -1
    62  		if (isPhantom) {
    63  			localStorage.clear()
    64  		} else {
    65  			var now = window.performance && window.performance.now
    66  				? function () { return window.performance.now() }
    67  				: Date.now
    68  			var metrics = { beforeLoad: now() }
    69  		}
    70  		</script>
    71  		<!-- end testing/bench -->
    72  
    73  		<script src="../../dist/vue.js"></script>
    74  		<script>metrics.afterLoad = now()</script>
    75  		<script src="node_modules/director/build/director.js"></script>
    76  		<script src="js/store.js"></script>
    77  		<script>metrics.beforeRender = now()</script>
    78  		<script src="js/app.js"></script>
    79  		<script src="js/routes.js"></script>
    80  		<script>metrics.afterRender = now()</script>
    81  		<script src="perf.js"></script>
    82  	</body>
    83  </html>