vue动态添加数据，并实现点击删除

最新推荐文章于 2024-08-08 22:30:15 发布

软件测试进阶中

最新推荐文章于 2024-08-08 22:30:15 发布

阅读量7.3k

点赞数

文章标签： vue

本文链接：https://blog.csdn.net/hard_days/article/details/82863450

版权

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script type="text/javascript" src="js/vue.js"></script>
</head>
<body>
	<!-- 
		注意; 每一个vue实例都是一个组件 每一个组件也都是一个vue实例


		父子组件之间带的通信：
			父组件传递数据给子组件： 通过属性绑定，并且子组件需要使用props接收
			子组件给父组件传递数据： 必须基于发布订阅模式，子组件需要先向外发布，父组件负责监听
	 -->
	<div id="app">
		<div>
			<input type="text" v-model="inputValue">
			<button @click="handleSubmit">提交</button>
		</div>
		<ul>
			<!--
				 使用全局组件 
				父组件给子组件传递参数的过程：
					1、在父组件的子组件上使用属性绑定 绑定需要传递的参数
					2、在子组件中使用props接受父组件的参数

			-->
			<todo-item 
				v-for='(item,index) of list' 
				:key="index"
				:item="item"
				:index="index"
				@