实习模块vue+java小型全栈开发(三)
实习模块vue+java小型全栈开发(三)
--dx
背景
首先,先给自己一个答案:这篇博客我定义为(三),因为之前的两个模块页面,内容都是一样的,但是被改了几次需求,就一直拖着没有上传。
今天是真正意义上的全栈开发,用的都是当前市面上的最新的框架前端是vuejs,后端springBoot全家桶,知识点很全,而我正好勉强的把前端知识赶完,然后进行的这次模块开发,并且这次模块开发给了我很大的惊喜。
全栈果然很神奇。
模块简介:点击考勤之后,调到一个页面,完成这个页面的所用功能。

完成之后的页面:我将页面分成了两部分(头部分和panel部分,使用了vux插件)

心得与总结
1.项目配置文件:第一次开发的时候开两个服务端口,一个8081,一个8085,前端8085端口向后端Java8081端口请求数据。当然,配置文件被封装过,我只需要拿封装过的js进行配置调用。这是我开发路的一个里程碑,实现了1的突破。

2.vux插件的使用:上一次的去哪儿文件里面写了一个swiper的插件的使用,轮播图。当时写得时候跟着视频觉得插件好简单用啊,今天却是栽了一个大跟头。插件看来看去,就是不知道怎么用,摸索了半天终于悟了。插件最关键的一点就是父组件给子组件传递数据,这些数据决定了插件的使用程度。就比如这个panel插件

官方文档给了四个属性,三个绑定方法:

这属于参数比较少的类型了,我运用了三个属性,一个事件,进行了列表的循环展示和获取更多的这两项功能,最后感慨一下,一定要学好原生js和vue原理啊,期待自己写组件的一天。
3.代码格式化的问题:这个代码格式化的问题,说起来真的是心酸,上次自己写得去哪儿项目,弄了半天,才把格式化弄好,今天的这个项目,顶着104的代码格式错误写,还好最后问老师把格式化的问题解决了,也学会了怎么配置eslint的使用已经npm run lint这个命令的使用,吃一堑长一智。
额...好像没了,后台没什么好说的了(会在编号为一,二的模块开发中写自己感悟),毕竟写了那么久了,Controller+Service+Repository+model,四个类就搞定了,还只有一个api.
好了,分享结束,好像也只有我一个人能够看懂,,。
实习模块vue+java小型全栈开发(三)的更多相关文章
- koa+mysql+vue+socket.io全栈开发之数据访问篇
后端搭起大体的框架后,接着涉及到的就是如何将数据持久化的问题,也就是对数据库进行 CURD 操作. 关于数据库方案, mongodb 和 mysql 都使用过,但我选用的是 mysql,原因: 目前为 ...
- 使用vue+flask做全栈开发的全过程(实现前后端分离)
花了几天的时间终于在本地把前后端跑通了,以一篇博客记录我这几天的心酸... 1.安装nodejs(自带npm,可能会出现版本错误,更新npm) 2.npm在国内下载时,可能会慢,所以建议要安装淘宝镜像 ...
- koa+mysql+vue+socket.io全栈开发之前端篇
React 与 Vue 之间的对比,是前端的一大热门话题. vue 简易上手的脚手架,以及官方提供必备的基础组件,比如 vuex,vue-router,对新手真的比较友好:react 则把这些都交给社 ...
- Python 全栈开发三 python基础 条件与循环
一. 条件语句 python条件语句是根据一条或多条语句的执行结果的真假(True Or False)来决定代码块的执行. 而执行内容可以多行,以缩进来区分表示同一范围. 1.Python判断条件真假 ...
- Python 全栈开发【第0篇】:目录
Python 全栈开发[第0篇]:目录 第一阶段:Python 开发入门 Python 全栈开发[第一篇]:计算机原理&Linux系统入门 Python 全栈开发[第二篇]:Python基 ...
- spring boot + vue + element-ui全栈开发入门——开篇
最近经常看到很多java程序员朋友还在使用Spring 3.x,Spring MVC(struts),JSP.jQuery等这样传统技术.其实,我并不认为这些传统技术不好,而我想表达的是,技术的新旧程 ...
- spring boot + vue + element-ui全栈开发入门——基于Electron桌面应用开发
前言 Electron是由Github开发,用HTML,CSS和JavaScript来构建跨平台桌面应用程序的一个开源库. Electron通过将Chromium和Node.js合并到同一个运行时环 ...
- Python全栈开发【模块】
Python全栈开发[模块] 本节内容: 模块介绍 time random os sys json & picle shelve XML hashlib ConfigParser loggin ...
- python全栈开发中级班全程笔记(第二模块、第四章(三、re 正则表达式))
python全栈开发笔记第二模块 第四章 :常用模块(第三部分) 一.正则表达式的作用与方法 正则表达式是什么呢?一个问题带来正则表达式的重要性和作用 有一个需求 : 从文件中读取所有联 ...
随机推荐
- HDU 1257 最少拦截系统 最长递增子序列
HDU 1257 最少拦截系统 最长递增子序列 题意 这个题的意思是说给你\(n\)个数,让你找到他最长的并且递增的子序列\((LIS)\).这里和最长公共子序列一样\((LCS)\)一样,子序列只要 ...
- ELK-全文检索技术-kibana操作elasticsearch
前言:建议kibana语法一定要学好! 1 软件安装 1.1 ES的安装 第一步:解压压缩包,放到一个没有中文没有空格的位置 第二步:修改配置文件 1. jvm.options ...
- ajax跨域jsonp —— javascript
目录 jsonp是什么 jsonp原理 原生js使用jsonp jquery使用jsonp jsonp是什么 jsonp作用:解决跨域问题 为什么有跨域问题? “同源策略限制了从同一个源加载的文档或脚 ...
- 【AST篇】教你如何编写 Eslint 插件
前言 虽然现在已经有很多实用的 ESLint 插件了,但随着项目不断迭代发展,你可能会遇到已有 ESLint 插件不能满足现在团队开发的情况.这时候,你需要自己来创建一个 ESLint 插件. 本文我 ...
- Struts2.5以上版本There is no Action mapped for namespace [/] and action name [userAction_login] associated with context path []
分析:Struts2在2.5版本后添加strict-method-invocation(严格方法访问),默认为true,不能使用动态方法调用功能,故需设为false struts.xml设置如下: & ...
- keymaps - 对键盘映射文件的描述
描述 (DESCRIPTION) loadkeys(1) 能够 通过 调入 指定的 文件 修改 键盘翻译表, 键盘翻译表 通常 用于 内核的 键盘驱动程序; 另外 dumpkeys(1) 可以 根据 ...
- 独家!三代Ryzen国行价格来了:12核3999
5月27日,AMD在2019台北电脑展COMPUTEX展前新闻发布会上举行主题演讲,AMD CEO苏姿丰登台,正式发布了第三代Ryzen锐龙处理器,新品共有3款,分别是Ryzen 7 3700X.Ry ...
- mysql个人初配置
记录下在ubuntu 18.04.3 LTS环境中安装mysql和个人初期简单设置. 1:安装myslq:sudo apt install mysql-server. 2:设置root密码.由于我没有 ...
- 009-通过jmx监控tomcat
前言想理解怎么监控tomcat,必需识下图(图片源出网络) zabbix-Web前端界面,它通过数据库里数据展示.和其它组件不直接关联zabbix-server运行在10051端口,Zabbix-se ...
- java数据结构03
1.求二叉树的深度 https://www.cnblogs.com/xudong-bupt/p/4036190.html class TreeNode { char val; TreeNode lef ...