一、功能描述:
1,对于输入的内容进行简单的判断。
2,实现简单的增加和删除功能。
二、运行情况
图1 页面初始化情况
点击"添加新用户"如下:
图2: 添加一个新用户
图3:删除Anna和张三两个用户
全部代码如下所示:(直接复制到一个.html文件即可成功运行)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>01-VUE的常用指令-综合练习</title>
<style>
#app {margin: 50px auto; width: 600px;}
fieldset {border: 1px solid orangered;margin-bottom:20px;}
fieldset input{width: 200px; height: 30px; margin: 10px 0;}
table{width: 600px;border: 2px solid orangered; text-align: center;}
thead{background-color: orangered;}
</style>
</head>
<body>
<