显示数据的前端界面如下:
项目代码结构层次:
前端代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
#app{
width: 820px;
margin: auto;
text-align: center;
}
.btn-add{
background: limegreen;
color: #fff;
border: none;
padding: 5px 10px;
border-radius: 5px;
}
.btn-modi{
padding: 5px 10px;
border-radius: 5px;
color: #fff;
text-decoration: none;
background: cornflowerblue;
}
.btn-del{
padding: 5px ;
border-radius: 5px;
color: #fff;
text-decoration: none;
background: violet;
}
tr{height: 50px;}
</style>
</head>
<body>
<div id="app">
<div class="ipt-wrap">
<form action="" method="post">
<input type="text" placeholder="请输入id账号" v-model="uid" name="" id="" value="" />
<input type="text" placeholder="请输入员工姓名" v-model="uname" name="" id="" value="" />
<input type="text" placeholder="请输入员工年龄" v-model="age" name="" id="" value="" />
<inpu