通用后台管理系统前端界面Ⅺ——信息列表页（弹窗复用增改、CRUD前端基础实现）

news2025/2/25 9:53:00

 因为需求发生了点变化，所以把之前的代码稍改一下，把之前的信息列表全复制到用户列表中，最后效果一样。UserList.vue

<template>
  <div class="UserList">
    <!-- 查询、重置 -->
    <el-form :inline="true" :model="formInline" class="demo-form-inline" size="small">
      <el-form-item label="姓名">
        <el-input v-model="formInline.name" placeholder="请输入姓名"></el-input>
      </el-form-item>
      <el-form-item>
          <el-button type="primary" @click="find()">查询</el-button>
      </el-form-item>
      <el-form-item>
        <el-button type="danger" @click="refresh()">刷新</el-button>
      </el-form-item>
    </el-form>
    <!-- <el-table :data="
      tableData.slice((currentPage - 1) * pageSize, currentPage * pageSize)
    " height="450" border style="width: 100%" :default-sort="{ prop: 'number', order: 'Ascending' }"> -->
    <el-table
      :data="compData"
      height="450"
      border
      style="width: 100%"
      :default-sort="{ prop: 'number', order: 'Ascending' }"
    >
      <!-- <el-table-column prop="id" label="序号" align="center"></el-table-column> -->
      <el-table-column type="selection" width="55"> </el-table-column>
      <el-table-column prop="number" label="学号" align="center" sortable>
      </el-table-column>
      <el-table-column prop="name" label="姓名" align="center">
      </el-table-column>
      <el-table-column prop="sex_text" label="性别" align="center">
      </el-table-column>
      <el-table-column prop="age" label="年龄" align="center" sortable>
      </el-table-column>
      <el-table-column prop="class" label="班级" align="center">
      </el-table-column>
      <el-table-column prop="state_text" label="状态" align="center">
      </el-table-column>
      <el-table-column prop="address" label="地址" align="center">
      </el-table-column>
      <el-table-column prop="phone" label="联系方式" align="center">
      </el-table-column>
      <el-table-column fixed="right" label="操作" align="center">
        <template slot-scope="scope">
          <el-button
            @click="del(scope.row)"
            icon="el-icon-delete"
            type="danger"
            size="mini"
            circle
          ></el-button>
          <el-button
            type="primary"
            icon="el-icon-edit"
            size="mini"
            circle
          ></el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="currentPage"
      :page-sizes="[5, 10, 20, 30, 50]"
      :page-size="pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total"
    >
    </el-pagination>
  </div>
</template>

<script>
import { Info, InfoDel } from "@/api/api.js";
export default {
  data() {
    return {
      tableData: [],
      currentPage: 1, //当前页数
      pageSize: 10, //每页显示条数
      total: 0,
      formInline: {
        name: ''
      }
    };
  },
  created() {
    this.getData();
  },
  computed: {
    compData() {
      return this.tableData.slice(
        (this.currentPage - 1) * this.pageSize,
        this.currentPage * this.pageSize
      );
    },
  },
  methods: {
    find(){
      this.getData(this.formInline)
    },
    refresh(){
      this.formInline = {}
      this.getData(this.formInline)
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.currentPage = 1;
    },
    handleCurrentChange(val) {
      this.currentPage = val;
    },
    getData(params) {
      Info(params).then((res) => {
        console.log(res.data);
        if (res.data.status === 200) {
          this.total = res.data.total;
          this.tableData = res.data.data;
          this.tableData.forEach((item) => {
            item.sex === 1 ? (item.sex_text = "男") : (item.sex_text = "女");
            item.state === "1"
              ? (item.state_text = "已入校")
              : item.state === "2"
              ? (item.state_text = "未入校")
              : (item.state_text = "休学中");
          });
        }
      });
    },
    del(row) {
      console.log(row);
      InfoDel(row.id).then((res) => {
        if (res.data.status === 200) {
          this.$message({ message: res.data.message, type: "success" });
          this.getData();
        }
      });
    },
  },
};
</script>

<style lang="scss">
.UserList {
  .demo-form-inline {
    text-align: left;
  }
  .el-pagination {
    text-align: left;
    margin-top: 20x;
  }
}
</style>

调整一下页面元素布局和样式：按钮、图标等。调整后

UserList.vue

<template>
  <div class="UserList">
    <!-- 查询、重置 -->
    <el-form
      :inline="true"
      :model="formInline"
      class="demo-form-inline"
      size="small"
    >
      <el-form-item>
        <el-input
          v-model="formInline.name"
          placeholder="请输入姓名"
          prefix-icon="el-icon-search"
        ></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="find()" plain round>查询</el-button>
      </el-form-item>
      <el-form-item>
        <el-button type="success" @click="refresh()" round>刷新</el-button>
      </el-form-item>
    </el-form>
    <!-- <el-table :data="
      tableData.slice((currentPage - 1) * pageSize, currentPage * pageSize)
    " height="450" border style="width: 100%" :default-sort="{ prop: 'number', order: 'Ascending' }"> -->
    <el-table
      :data="compData"
      height="450"
      border
      style="width: 100%"
      :default-sort="{ prop: 'number', order: 'Ascending' }"
    >
      <!-- <el-table-column prop="id" label="序号" align="center"></el-table-column> -->
      <el-table-column type="selection" width="55"> </el-table-column>
      <el-table-column prop="number" label="学号" align="center" sortable>
      </el-table-column>
      <el-table-column prop="name" label="姓名" align="center">
      </el-table-column>
      <el-table-column prop="sex_text" label="性别" align="center">
      </el-table-column>
      <el-table-column prop="age" label="年龄" align="center" sortable>
      </el-table-column>
      <el-table-column prop="class" label="班级" align="center">
      </el-table-column>
      <el-table-column prop="state_text" label="状态" align="center">
      </el-table-column>
      <el-table-column prop="address" label="地址" align="center">
      </el-table-column>
      <el-table-column prop="phone" label="联系方式" align="center">
      </el-table-column>
      <el-table-column fixed="right" label="操作" align="center" width="100">
        <template slot-scope="scope">
          <el-button
            type="primary"
            icon="el-icon-edit"
            size="mini"
            circle
            
          ></el-button>
          <el-button
            @click="del(scope.row)"
            icon="el-icon-delete"
            type="danger"
            size="mini"
            circle plain
          ></el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="currentPage"
      :page-sizes="[5, 10, 20, 30, 50]"
      :page-size="pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total"
    >
    </el-pagination>
  </div>
</template>

<script>
import { Info, InfoDel } from "@/api/api.js";
export default {
  data() {
    return {
      tableData: [],
      currentPage: 1, //当前页数
      pageSize: 10, //每页显示条数
      total: 0,
      formInline: {
        name: "",
      },
    };
  },
  created() {
    this.getData();
  },
  computed: {
    compData() {
      return this.tableData.slice(
        (this.currentPage - 1) * this.pageSize,
        this.currentPage * this.pageSize
      );
    },
  },
  methods: {
    find() {
      this.getData(this.formInline);
    },
    refresh() {
      this.formInline = {};
      this.getData(this.formInline);
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.currentPage = 1;
    },
    handleCurrentChange(val) {
      this.currentPage = val;
    },
    getData(params) {
      Info(params).then((res) => {
        console.log(res.data);
        if (res.data.status === 200) {
          this.total = res.data.total;
          this.tableData = res.data.data;
          this.tableData.forEach((item) => {
            item.sex === 1 ? (item.sex_text = "男") : (item.sex_text = "女");
            item.state === "1"
              ? (item.state_text = "已入校")
              : item.state === "2"
              ? (item.state_text = "未入校")
              : (item.state_text = "休学中");
          });
        }
      });
    },
    del(row) {
      console.log(row);
      InfoDel(row.id).then((res) => {
        if (res.data.status === 200) {
          this.$message({ message: res.data.message, type: "success" });
          this.getData();
        }
      });
    },
  },
};
</script>

<style lang="scss">
.UserList {
  .demo-form-inline {
    text-align: left;
  }
  .el-pagination {
    text-align: left;
    margin-top: 20x;
  }
}
</style>

信息列表页实现

根据接口返回来的的数据进行修改表头及调整样式 

 InfoList.vue

<template>
  <div class="InfoList">
    <!-- 查询、重置 -->
    <el-form
      :inline="true"
      :model="formInline"
      class="demo-form-inline"
      size="small"
    >
      <el-form-item>
        <el-input
          v-model="formInline.name"
          prefix-icon="el-icon-search"
          placeholder="请输入姓名"
        ></el-input>
      </el-form-item>
      <el-form-item>
        <el-button
          @click="find()"
          type="primary"
          icon="el-icon-search"
          circle
          size="small"
        ></el-button>
      </el-form-item>
      <el-form-item>
        <el-button
          type="success"
          @click="add()"
          circle
          size="small"
          icon="el-icon-circle-plus-outline"
        ></el-button>
      </el-form-item>
      <el-form-item>
        <el-button
          type="success"
          plain
          @click="refresh()"
          circle
          size="small"
          icon="el-icon-refresh"
        ></el-button>
      </el-form-item>
      <el-form-item>
        <el-button
          type="danger"
          plain
          @click="delPitch()"
          circle
          size="small"
          icon="el-icon-delete"
        ></el-button>
      </el-form-item>
    </el-form>
    <!-- <el-table :data="
      tableData.slice((currentPage - 1) * pageSize, currentPage * pageSize)
    " height="450" border style="width: 100%" :default-sort="{ prop: 'number', order: 'Ascending' }"> -->
    <el-table
      :data="compData"
      height="450"
      border
      style="width: 100%"
      :default-sort="{ prop: 'number', order: 'Ascending' }"
    >
      <!-- <el-table-column prop="id" label="序号" align="center"></el-table-column> -->
      <el-table-column type="selection" width="55"> </el-table-column>
      <el-table-column prop="number" label="学号" align="center" sortable>
      </el-table-column>
      <el-table-column prop="name" label="姓名" align="center">
      </el-table-column>
      <el-table-column prop="sex_text" label="性别" align="center">
      </el-table-column>
      <el-table-column prop="age" label="年龄" align="center" sortable>
      </el-table-column>
      <el-table-column prop="father" label="父亲" align="center">
      </el-table-column>
      <el-table-column prop="mather" label="母亲" align="center">
      </el-table-column>
      <el-table-column prop="time" label="入校时间" align="center">
      </el-table-column>
      <el-table-column prop="address" label="家庭住址" align="center">
      </el-table-column>
      <el-table-column prop="phone" label="联系方式" align="center">
      </el-table-column>
      <el-table-column fixed="right" label="操作" width="100" align="center">
        <template slot-scope="scope">
          <el-button
            @click="edit(scope.row)"
            type="primary"
            icon="el-icon-edit"
            circle
            size="mini"
          ></el-button>
          <el-button
            @click="del(scope.row)"
            type="danger"
            icon="el-icon-delete"
            circle
            size="mini"
          ></el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="currentPage"
      :page-sizes="[5, 10, 20, 30, 50]"
      :page-size="pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total"
    >
    </el-pagination>
  </div>
</template>

<script>
import { Info, InfoDel } from "@/api/api.js";
export default {
  data() {
    return {
      tableData: [],
      currentPage: 1, //当前页数
      pageSize: 10, //每页显示条数
      total: 0,
      formInline: {
        name: "",
      },
    };
  },
  created() {
    this.getData();
  },
  computed: {
    compData() {
      return this.tableData.slice(
        (this.currentPage - 1) * this.pageSize,
        this.currentPage * this.pageSize
      );
    },
  },
  methods: {
    find() {
      this.getData(this.formInline);
    },
    refresh() {
      this.formInline = {};
      this.getData(this.formInline);
    },
    del(row) {
      console.log(row);
      InfoDel(row.id).then((res) => {
        if (res.data.status === 200) {
          this.$message({ message: res.data.message, type: "success" });
          this.getData();
        }
      });
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.currentPage = 1;
    },
    handleCurrentChange(val) {
      this.currentPage = val;
    },
    getData(params) {
      Info(params).then((res) => {
        console.log(res.data);
        if (res.data.status === 200) {
          this.total = res.data.total;
          this.tableData = res.data.data;
          this.tableData.forEach((item) => {
            item.sex === 1 ? (item.sex_text = "男") : (item.sex_text = "女");
            item.state === "1"
              ? (item.state_text = "已入校")
              : item.state === "2"
              ? (item.state_text = "未入校")
              : (item.state_text = "休学中");
          });
        }
      });
    },
  },
};
</script>

<style lang="scss">
.InfoList {
  .demo-form-inline {
    text-align: left;
  }

  .el-pagination {
    text-align: left;
    margin-top: 20x;
  }
}
</style>

 弹窗复用新增功能

1、找

 2、触发式组件放置在页面最下面，再按需修改

         ①实现基本弹窗效果（隐藏，点击后显示）

        ② 修改表单内容

1、修改用户需要填的内容，为提用户体验，实现更加良好的用户交互性，性别填写采用单选框、入校时间采用DatePicker日期选择器 

2、定义表单校验规则，使用v-model实现表单数据的双向绑定

 表单效果：

 调整样式：

        ①规划左侧label

  调整前                                                        调整后

                ​​​​​​​        ​​​​​​​       

 ②调整弹窗dialog的宽度

3、完善表单的校验规则

 4、封装api请求接口、连接后端

创建点击事件，对传递数据对象——新建用户信息，进行打印查看。

 

 

 

 

 

  弹窗复用修改功能

 

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/39686.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

UnityShader_基础理论

UnityShader_基础理论

渲染流程 此处的渲染流程只是一个概念流水线。大概分为应用阶段、几何阶段、光栅化阶段。 应用阶段 主要输出渲染所需的几何信息&#xff0c;包括点、线、三角面等&#xff0c;传递给下一阶段使用&#xff1b;这一阶段主要CPU处理&#xff0c;该阶段产生的产物就是渲染图元…
阅读更多...
【ML特征工程】第 6 章 ：降维：用 PCA 压缩数据薄饼

【ML特征工程】第 6 章 ：降维：用 PCA 压缩数据薄饼

&#x1f50e;大家好&#xff0c;我是Sonhhxg_柒&#xff0c;希望你看完之后&#xff0c;能对你有所帮助&#xff0c;不足请指正&#xff01;共同学习交流&#x1f50e; &#x1f4dd;个人主页&#xff0d;Sonhhxg_柒的博客_CSDN博客 &#x1f4c3; &#x1f381;欢迎各位→点赞…
阅读更多...
Java并发-synchronized使用方法

Java并发-synchronized使用方法

synchronized 关键字介绍 Java 中的每个对象都可以把它当作一个同步锁来使用&#xff0c;这些 Java 内置的使用者看不到的锁被称为内部锁&#xff0c;也叫作监视器锁。代码在进入 synchronized 代码块前会自动获取内部锁&#xff0c;这时候其他线程访问该同步代码块时会被阻塞…
阅读更多...
十七、CANdelaStudio深入-创建新工程

十七、CANdelaStudio深入-创建新工程

本专栏将由浅入深的展开诊断实际开发与测试的数据库编辑，包含大量实际开发过程中的步骤、使用技巧与少量对Autosar标准的解读。希望能对大家有所帮助，与大家共同成长，早日成为一名车载诊断、通信全栈工程师。 本文介绍CANdelaStudio创建新工程的过程，欢迎各位朋友订阅、评论…
阅读更多...
别卷了！今年局势不一样开始裁员濒临失业

别卷了！今年局势不一样开始裁员濒临失业

我被优化了&#xff0c;公司劳动合同都当天解除完&#xff0c;电脑也今天全部打包完&#xff0c;非常快&#xff0c;我也是惊呆了&#xff0c;刚刚和他们部门的人吃完饭&#xff0c;感觉今天就是一场梦&#xff0c;昨天还是催着做需求&#xff0c;今天说散就散”&#xff0c;前…
阅读更多...
论文浅尝 | Efficient RDF graph storage based on RL

论文浅尝 | Efficient RDF graph storage based on RL

笔记整理&#xff1a;郑国鹏&#xff0c;天津大学硕士链接&#xff1a;https://link.springer.com/article/10.1007/s11280-021-00919-x动机知识是人工智能的基石&#xff0c;它通常以RDF图的形式表示。各个领域的大规模RDF图对图数据管理提出了新的挑战。关系型数据库因其成熟…
阅读更多...
Java8 Collectors.toMap() 的使用

Java8 Collectors.toMap() 的使用

目录一、简单介绍用法1&#xff1a;根据某一属性&#xff0c;对对象的实例或属性做映射用法2&#xff1a;根据某一属性&#xff0c;对对象集合进行去重二、Duplicate key 异常1&#xff09;异常重现&#xff1a;2&#xff09;异常截图&#xff1a;3&#xff09;异常说明&#x…
阅读更多...
点云梯度下采样

点云梯度下采样

点云下采样又称点云精简。 均匀网格下采样 均匀网格下采样法是建立在空间包围盒精简算法之上对散乱点云快速简化的一种算法&#xff0c;其基本思想为&#xff1a;根据点云数据的密度确定最小三维网格&#xff08;体素&#xff09;的边长为a∗b∗ca*b*ca∗b∗c&#xff0c;计算…
阅读更多...
含电热联合系统的微电网运行优化matlab程序（yalmip+cplex）（yalmip+gurobi）

含电热联合系统的微电网运行优化matlab程序（yalmip+cplex）（yalmip+gurobi）

含电热联合系统的微电网运行优化matlab程序&#xff08;yalmipcplex&#xff09;&#xff08;yalmipgurobi&#xff09; 参考文献&#xff1a;含电热联合系统的微电网运行优化 在当前能源互联网迅速发展及电热联系日渐紧密的环境下&#xff0c;提出基于电热联合调度的区域并网…
阅读更多...
个人电影网站web网页设计制作—— 影视公司5页 DIV+CSS制作 浮动布局

个人电影网站web网页设计制作—— 影视公司5页 DIV+CSS制作 浮动布局

HTML实例网页代码, 本实例适合于初学HTML的同学。该实例里面有设置了css的样式设置&#xff0c;有div的样式格局&#xff0c;这个实例比较全面&#xff0c;有助于同学的学习,本文将介绍如何通过从头开始设计个人网站并将其转换为代码的过程来实践设计。 精彩专栏推荐&#x1f4…
阅读更多...
【Vim】更改Vim编辑器的字体大小、改变字号；永久改变字号；改变字体颜色、字体显示样式

【Vim】更改Vim编辑器的字体大小、改变字号；永久改变字号；改变字体颜色、字体显示样式

一、问题背景 初次使用Vim&#xff0c;由于电脑分辨率较高&#xff0c;在编辑器上显示的文本字号较小&#xff0c;不甚看清。 我使用的是Gvim for Windows。 二、网上的已有方法小结 2.1 快捷键ctrl 和ctrl - 标题中提到的号&#xff0c;需要按下shift才能输入&#xff0c…
阅读更多...
用DIV+CSS技术设计的公益主题网站——防止电信诈骗（web前端网页制作课作业）

用DIV+CSS技术设计的公益主题网站——防止电信诈骗（web前端网页制作课作业）

&#x1f389;精彩专栏推荐 &#x1f4ad;文末获取联系 ✍️ 作者简介: 一个热爱把逻辑思维转变为代码的技术博主 &#x1f482; 作者主页: 【主页——&#x1f680;获取更多优质源码】 &#x1f393; web前端期末大作业&#xff1a; 【&#x1f4da;毕设项目精品实战案例 (10…
阅读更多...
狂神说MybatisPlus学习笔记

狂神说MybatisPlus学习笔记

MyBatis-Plus 学习MyBatis-Plus之前要先学MyBatis–>Spring—>SpringMVC 为什么要学它?MyBatisPlus可以节省我们大量的时间,所有CRUD代码都可以自动完成 JPA, tk-mapper ,MyBatisPlus 偷懒用的! 1.简介 是什么? 2.特性 无侵入&#xff1a;只做增强不做改变&am…
阅读更多...
C语言第十二课(上)：操作符详解【算数、移位、位、赋值操作符】

C语言第十二课(上)：操作符详解【算数、移位、位、赋值操作符】

目录 前言&#xff1a; 一、操作符分类&#xff1a; 二、操作符详解&#xff1a; 1.算术操作符、-、*、/、%&#xff1a; 2.移位操作符>>、<<&#xff1a; 1.原码、反码与补码&#xff1a; 2.左移操作符&#xff1a; 3.右移操作符&#xff1a; 4.警告⚠&#xf…
阅读更多...
Qt5开发从入门到精通——第十二篇三节（Qt5 事件处理及实例——多线程应用、服务器端编程、客户端编程）

Qt5开发从入门到精通——第十二篇三节（Qt5 事件处理及实例——多线程应用、服务器端编程、客户端编程）

提示&#xff1a;欢迎小伙伴的点评✨✨&#xff0c;相互学习c/c应用开发。&#x1f373;&#x1f373;&#x1f373; 博主&#x1f9d1;&#x1f9d1; 本着开源的精神交流Qt开发的经验、将持续更新续章&#xff0c;为社区贡献博主自身的开源精神&#x1f469;‍&#x1f680; 文…
阅读更多...
用DIV+CSS技术设计的抗击疫情网页与实现制作（web前端网页制作课作业）

用DIV+CSS技术设计的抗击疫情网页与实现制作（web前端网页制作课作业）

&#x1f389;精彩专栏推荐 &#x1f4ad;文末获取联系 ✍️ 作者简介: 一个热爱把逻辑思维转变为代码的技术博主 &#x1f482; 作者主页: 【主页——&#x1f680;获取更多优质源码】 &#x1f393; web前端期末大作业&#xff1a; 【&#x1f4da;毕设项目精品实战案例 (10…
阅读更多...
基于C++实现的游客信息管理系统

基于C++实现的游客信息管理系统

目 录 一、 项目技术路线说明 1 二、 项目需求分析 2 2.1 项目介绍 2 2.2 功能需求 2 三、 系统分析与设计 3 3.1 本程序需解决的关键技术问题 3 3.2 程序流程 3 3.2.1 注册或登陆流程图 3 3.2.2 信息日期判断流程图 4 3.2.3 操作功能选择模块 5 3.3 功能模块 6 3.3.1 增删改查…
阅读更多...
让Unity打包AssetBundle更轻松

让Unity打包AssetBundle更轻松

AssetBundle作用1、AssetBundle是一个压缩包包含模型、贴图、预制体、声音、甚至整个场景&#xff0c;可以在游戏运行的时候被加载&#xff1b; 2、AssetBundle自身保存着互相的依赖关系&#xff1b; 3、压缩包可以使用LZMA和LZ4压缩算法&#xff0c;减少包大小&#xff0c;更快…
阅读更多...
HTML小游戏13 —— 仿《神庙逃亡》3D风格跑酷游戏《墓地逃亡》（附完整源码）

HTML小游戏13 —— 仿《神庙逃亡》3D风格跑酷游戏《墓地逃亡》（附完整源码）

&#x1f482; 网站推荐:【神级源码资源网】【摸鱼小游戏】&#x1f91f; 前端学习课程&#xff1a;&#x1f449;【28个案例趣学前端】【400个JS面试题】&#x1f485; 想寻找共同学习交流、摸鱼划水的小伙伴&#xff0c;请点击【摸鱼学习交流群】&#x1f4ac; 免费且实用的计…
阅读更多...
BGP服务器

BGP服务器

BGP服务器被称为“边界网关协议”(BGP)&#xff0c;是一种用于在不同主机网关、 Internet或自治系统之间传输数据和信息的路由协议。 BGP是一种路径矢量协议(PVP)&#xff0c;它维护不同主机、网络和网关的路由器的路径&#xff0c;并根据 BGP做出路由决定。把电信、联通、联通…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023