php做信息录入,vue实现员工信息录入功能的方法

Vue通用信息录入界面，供大家参考，具体内容如下

员工信息录入

.btn1{

color: blue;

background: skyblue;

text-align: center;

}

员工信息录入

姓名：

年龄：

性别：

>

男

女

手机：

新增用户

序号姓名年龄性别手机操作

{{index+1}}{{student.name}}{{student.age}}{{student.sex}}{{student.phoneNo}}移除

总行数：{{studentsList.length}}

var p1Data={

newStudent:{name:"",age:0,sex:"男",phoneNo:""},

studentsList:[{No:"0001",name:"张三",age:18,sex:"男",phoneNo:"13688899900"},

{No:"0112",name:"王五",age:28,sex:"男",phoneNo:"18800068888"},

{No:"0253",name:"林志玲",age:33,sex:"女",phoneNo:"18600001002"},

{No:"0608",name:"林志颖",age:68,sex:"男",phoneNo:"15998769900"}],

};

var vm1=new Vue({

el:"#p2",

data:p1Data,

methods:{

//移除一行

DeletestudentRow:function (index) {

this.studentsList.splice(index,1);

},

//添加一行

createStudent: function(){

this.studentsList.push(this.newStudent);

// 添加完newPerson对象后，重置newPerson对象

this.newStudent = {name:"",age:0,sex:"男",phoneNo:""}

},

}

});

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。