实习模块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全栈开发笔记第二模块 第四章 :常用模块(第三部分) 一.正则表达式的作用与方法 正则表达式是什么呢?一个问题带来正则表达式的重要性和作用 有一个需求 : 从文件中读取所有联 ...
随机推荐
- Java第六周实验+总结
一.实验目的 (1)掌握类的继承 1.子类继承父类中非private的成员变量和成员方法,同时,注意构造方法不能被子类继承. 2.定义类时若缺省extends关键字,则所定义的类为java.lang. ...
- Solr 4.4.0利用dataimporthandler导入本地pdf、word等文档
1. 创建本地目录 $ mkdir /usr/local/contentplatform/solr/solr/core1/file1 $ ls -lh total 88M -rw-r--r-- tnu ...
- PostgreSQL逻辑复制到kafka-实践
kafka 安装 wget http://mirror.bit.edu.cn/apache/kafka/2.3.0/kafka_2.12-2.3.0.tgz cp kafka_2.12-2.0.1.t ...
- Anaconda配置环境变量+创建虚拟环境+pycharm使用虚拟环境
Anaconda配置环境变量+创建虚拟环境 配置环境变量 没有添加系统变量,所有系统根本识别不了conda命令,找不到位置,所以添加以下系统变量: 添加对应Anaconda环境变量:(以自己的安装路径 ...
- fatal: refusing to merge unrelated histories问题解决
git中pull或merge时偶尔出现
- webpack入门学习手记(一)
本人微信公众号:前端修炼之路,欢迎关注. 之前用过gulp.grunt,但是一直没有学习过webpack.这两天刚好有时间,学习了下webpack.webpack要想深入研究,配置的东西比较多,网上的 ...
- RabbitMQ入门教程(十二):消息确认Ack
原文:RabbitMQ入门教程(十二):消息确认Ack 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog.csd ...
- IDEA的快捷方式
一,IDEA的快捷方式1,F8单步执行 2,F9运行调试 3,CTRL +鼠标左键=进入查看定义 4,CTRL+alt +鼠标左键=查看实现 5,Shift+F6重命名 6,alt +intsert= ...
- ubuntu中apache的ssl证书配置及url重写
一.https原理 借用网上的图(图片来源: https://www.cnblogs.com/xiohao/p/9054355.html ),用到了对称加密和非对称加密. 二.ubuntu的ap ...
- Bashed -- hack the box
Introduction Target: 10.10.10.68 (OS: Linux) Kali linux: 10.10.16.44 Information Enumeration Firstly ...