案例-todolist计划列表显示列表

Posted eliwen

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了案例-todolist计划列表显示列表相关的知识,希望对你有一定的参考价值。

	<div class="list_con" id="todolist">
		<h2>To do list</h2>
		<input type="text" name="" id="txt1" class="inputtxt">
		<input type="button" name="" value="增加" id="btn1" class="inputbtn">

		<ul id="list" class="list">
			<li v-for="data in data_list">
				<span>{{data}}</span>
				<a href="javascript:;" class="up">↑</a>
				<a href="javascript:;" class="down">↓</a>
			    <a href="javascript:;" class="del">删除</a>
			</li>
		</ul>
	</div>

	<script>
		var vm = new Vue({
			el:"#todolist",
			data:{
				data_list:[
					"学习html",
					"学习css",
					"学习js",
				]
			}
		})

	</script>

  

以上是关于案例-todolist计划列表显示列表的主要内容,如果未能解决你的问题,请参考以下文章

案例-todolist计划列表删除计划

案例-todolist计划列表添加计划

小程序 第一个学习示例(TodoList)

JavaScript this.todoList.filter 不是函数

JS——DOM操作(createElementappendChild的用法,及todolist案例)

妙V课堂 Vue课程“年终任务列表案例”