vue 使用 elementUI 框架 做列表的增、删、改

制作一个列表可增、 删、 改 ，如图：

html 代码 

<!--用的是单独加载的方式 -->

<!--elementUi 样式文件 在官网下载 -->
<link rel="stylesheet" href="./lib/element-ui/index.css">

<!-- 样式文件 -->
<link rel="stylesheet" type="text/css" href="css/default/el-common.css"/>

<!--vue js文件 在官网下载 -->
<script src="./js/default/vue.min.js"></script>

<!--elementUi js文件 在官网下载 -->
<script src="./lib/element-ui/index.js"></script>

<div id="app">
	<div class="elTableCont">
		<template>
			<el-row class="elTableTopBtn">
				<el-button size="mini" type="primary" @click="handleAdd">新增</el-button>
			</el-row>
			<el-table :data="tableData" border stripe>
				<el-table-column type="index" :index="indexMethod" label="行号" width="100" align="center"> </el-table-column>
				<el-table-column label="序号" width="100" align="center">
					<template slot-scope="scope">
						{
  { (current - 1) * size + scope.$index + 1 }}
					</template>
				</el-table-column>
				<el-table-column prop="date" label="日期" width="180" align="center">
					<template slot-scope="{row, $index}">
						<el-input v-if="showEdit[$index]" class="edit-cell" v-model="row.date" placeholder="请输入日期" size="mini"></el-input>
						<span v-else>