随笔分类 - 测试开发
摘要：基于 springboot+vue 的测试平台开发继续更新。 模块树节点的开发暂告一段落，现在开发右边接口相关的部分，今天先完成列表的功能。 功能是这样，当点击树的某个节点时候，右侧列表展示这个节点下的所有接口，带分页（最终效果图）。 需要注意的是，因为节点下还有子节点，所以列表的功能需要使用递归来
阅读全文
摘要：基于 springboot+vue 的测试平台开发继续更新。 一、编辑功能 1. 编辑页外显 点击树节点的编辑按钮，打开对话框，展示原有的节点名称。 本来树形控件里没有自带的编辑操作，我直接加了一个按钮在上面，绑定点击事件调用edit(data)方法。 为了确认 data 可用，我在edit方法中打
阅读全文
摘要：基于 springboot+vue 的测试平台开发继续更新。 一、前端Tree树形控件的append方法 在elementUI 树控件下有个append方法，可以用来为 Tree 中的一个节点追加一个子节点。 目前我们已经完成了树列表的接口，可以在 append 方法中输出一下传入的 data 里到
阅读全文
摘要：基于 springboot+vue 的测试平台开发继续更新。 上一篇完成了模块树的列表接口，接下来可以和前端页面联调了。 一、存放接口的js文件 老样子，新建js文件，把要调用的后端接口请求封装在 src/api/apiModule.js这里： import request from '@/util
阅读全文
摘要：国庆节快乐！基于 springboot+vue 的测试平台开发继续更新。 上次完成了接口定义功能的前端页面，那么后端现在开始逐一实现对应的功能，首先就是提供模块列表接口，这个模块是支持子层级的，所以大概结构是这样： [ { id: 1, label: '默认', children: [ { id:
阅读全文
摘要：基于 springboot+vue 的测试平台开发继续更新。 一、功能简介 今天的目标是画一个接口管理列表的前端页面。本来我也想去弄个简单的原型图先，但是搜了个网页工具一时半会也不会用，作罢。 最终决定直接用 elementUI 的组件拼一个出来。直到最后完成用了大半天时间，很显然这个页面对我来说还
阅读全文
摘要：基于 springboot+vue 的测试平台开发继续更新。 今天实现项目列表的编辑功能： 点击【编辑】按钮，打开对话框，显示此条记录的信息 修改对话框表单内容，点击对话框【保存】按钮，更新此条记录 一、打开编辑页面显示数据 1. 编辑按钮 之前复制的 table 组件，里面带有 2 个按钮，修改其
阅读全文
摘要：基于 springboot+vue 的测试平台开发继续更新。 一、查询功能 在之前的项目列表接口里，支持使用项目名称模糊查询，现在来实现前端。 1. input 输入框 到组件库里找个输入框： 复制代码，修改代码： v-model: 绑定了下面 data 中的projectQuery.project
阅读全文
摘要：基于 springboot+vue 的测试平台开发继续更新。 今天来完成项目列表的前端部分。 一、前后端调通 开发前端页面，框架里有 2 个地方需要改动： src/views: 这里是开发页面的地方，也就是 vue 文件，可以按功能模块新建子目录来进行分类。 src/api: vue 页面里请求的后
阅读全文
摘要：基于 springboot+vue 的测试平台开发继续更新。 打开项目管理，就需要看到列表里展示项目数据，比如这样(截图是这个前端框架的demo，仅作示意)： 那么对应到我们平台的项目管理功能，就需要有： 列表展示添加的项目数据 可以通过项目名称查询指定的项目 新增项目 编辑项目 其他功能... 新
阅读全文
摘要：基于 springboot+vue 的测试平台开发继续更新。 接下来开发项目管理，是一个很常规的功能：有列表页、查询、新增、编辑，删除暂时先不做。 首先来做新增项目的功能，先实现后端接口。 一、编写实体类 Project 定义实体类的属性，对应着数据库对应表里的字段。 package com.pin
阅读全文
摘要：一、前端环境搭建 在前端框架vue-element-admin这个项目中，有一个简洁轻量型的项目vue-admin-template，这里面初始化的内容少，适合初学者，防止一上来就被那么多的代码弄晕。 快速安装 # 克隆项目 git clone https://github.com/PanJiaCh
阅读全文
摘要：一、前言 前阵子对于 spring 技术栈做了一些快速的了解，最近萌生出了动动手开发一个测试平台的念头（开发大佬请跳过）。 目的就是一个：提高动手能力，更好的消化学习的知识，从而进一步提升自己。 至于测试平台在公司中应用的实用性如何？据我观察，这个问题在相当长的一段时间内都不会有一致的答案，所以这里
阅读全文
摘要：上一篇里提到了用elementUI的select实现了个远程搜索的功能，最终效果是这样的。 但是继续开发的时候，又遇到了一个新的问题，跟上面的功能有关。 先看下远程搜索的操作，与data里的数据关系。 当输入“张”进行搜索，看到的下拉列表里展示的结果都是存放在data的options: []。 当我
阅读全文
摘要：先提下背景：就是在测试的过程中，经常需要用到收货这个功能。在PC端下了采购单，再到APP去对应功能里，再输入好多个字段，上传图片等动作后，终于可以提交。 于是，我决定在平台上加个小工具，快捷收货，方便测试用。 那么，在收货操作中，要有收货人这个角色。为了更好的适用性，我决定做成一个搜索框，支持实时搜
阅读全文
摘要：要实现一个功能：从页面A跳转到页面B，并且页面A的参数要传递到页面B，B使用传过来的参数。 从A到B。 其实就是2步走：1，A传递参数。2，B接受参数。 一、页面跳转、传递参数 在A页面的对应按钮，写上一个方法，点击的时候调用这个方法，进行跳转。 # content of A <el-button
阅读全文
摘要：vue指令带有前缀 v-。 一、v-bind 单向数据绑定 在html中显示数据，除了使用插值表达式{{}}之外，也可以使用vue中的v-bind指令。 ... ... <body> <div id="app"> <!-- v-bind指令 --> <h1 v-bind:title="message
阅读全文
摘要：一、前端开发工具vscode 前端代码编写工具，使用vscode：vscode官网 安装好之后，可以先装如下几个插件，方便后续的开发。 二、编写代码 1.vscode快捷键生成html代码 在vscode里新建一个html文件，然后输入一个 英文感叹号!，点击就可以快速生成html基础代码了。 2.
阅读全文
摘要：用mp也可以方便的实现稍复杂点的条件查询，当然了很复杂的就还是要xml编写sql了。 一、wapper介绍 先看下mp的条件构造抽象类的结构： Wrapper： 条件构造抽象类，最顶端父类 AbstractWrapper： 用于查询条件封装，生成 sql 的 where 条件 QueryWrappe
阅读全文
摘要：通过mybatis-plus实现分页，也是很简单，插件大法。 一、分页 1、配置分页插件 把分页的插件也配置到统一的配置类里： @Configuration // 配置扫描mapper的路径 @MapperScan("com.pingguo.mpdemo.mapper") public class
阅读全文
公告
公众号: 把苹果咬哭的测试笔记
