基于element-ui表格的弹出form对话框的很low的增删改查

最新推荐文章于 2024-06-26 09:24:45 发布

cszhaomeng

最新推荐文章于 2024-06-26 09:24:45 发布

阅读量3.9k

点赞数 2

分类专栏：技术

本文链接：https://blog.csdn.net/cszhaomeng/article/details/102001219

版权

本文介绍如何利用element-ui库，在表格中通过弹出对话框进行创建(Create)、读取(Retrieve)、更新(Update)和删除/Delete)数据的操作，展示了一种简单但实用的方法。

摘要由CSDN通过智能技术生成

基于element-ui表格的弹出form对话框的很low的增删改查

<template>
  <div class="home">
    <el-container>
      <el-header height="50px">学生信息管理</el-header>
      <el-main>
        <el-row>
          <el-col :span="6">
            <el-input v-model="input" placeholder="请输入姓名或手机号"></el-input>
          </el-col>
          <el-col :span="18">
            <!-- 查询 -->
            <el-button type="primary" size="medium" @click="cha">查询</el-button>
            <el-drawer
              title="学生信息"
              :visible.sync="table"
              :before-close="handleClose"
              direction="ttb"
              size="50%"
            >
              <el-table :data="a" border style="width: 100%">
                <el-table-column prop="xuhao" type="index" width="50" label="序号"></el-table-column>
                <el-table-column prop="xingming" label="姓名" width="120"></el-table-column>
                <el-table-column prop="phone" label="手机号" width="200"></el-table-column>
                <el-table-column prop="QQ" label="QQ号" width="120"></el-table-column>
                <el-table-column prop="work" label=