
前端
前端博客,以及和前端挂钩的的知识
only老K
这个作者很懒,什么都没留下…
展开
-
Only老K说-SPA项目之v-charts
博客目标前期提要前期提要接到项目需求,使用vue做一个表图原创 2019-12-31 08:56:52 · 307 阅读 · 2 评论 -
Only老K说-spa项目实现jwt验证码
博客目标实现思路实现思路登录界面向后台请求验证码,后台就先调用随机函数生成验证码,并且根据验证码生成一张图片,以 base64 字符串的形式传到前台,这时我们还要生成verificationJwt令牌做为请求验证码客户端的区分。我们先将验证码信息存入redis。key是 verificationJwt令牌的值,value就是验证码了。并且将令牌放入到响应头。传给客户端。当客户端提交的时候将保持...原创 2019-12-28 04:39:21 · 630 阅读 · 0 评论 -
Only老K说-SSH框架搭载layui完成左侧树功能
目录前期提要撸起来提供index.jsp提供代码:效果图:左侧树点击出现选项卡解决问题左侧树显示出现未命名前期提要搭建SSH框架,此处不多说自己看 我的博客SSH整合项目中导入layui 点击下载即可撸起来提供index.jsp<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncodin...原创 2019-10-22 10:17:53 · 529 阅读 · 0 评论 -
Only老K说-SSH框架搭载layui完成下拉框动态加载
目录前期提要撸起来提供需要使用的代码下拉框动态加载数据Sys_UserDao.java得到数据:最终效果图:前期提要搭建SSH框架,此处不多说自己看 我的博客SSH整合项目中导入layui 点击下载即可撸起来提供需要使用的代码下拉框 <select name="chc_due_to1" id="chc_due_to1" style="width:100px"> ...原创 2019-10-23 15:54:27 · 343 阅读 · 0 评论 -
Only老K说-SSH框架搭载layui实现select下拉框动态数据回显绑定
目录前期提要撸起来前台代码后台代码Bas_DictDao.javaBas_DictAction.java效果图前期提要搭建SSH框架,此处不多说自己看 我的博客SSH整合项目中导入layui 点击下载即可以及完成下拉框动态加载点击查看撸起来前台代码$.ajax({ url: '${pageContext.request.contextPath}/sy/bas_dict_...原创 2019-10-25 12:14:27 · 449 阅读 · 0 评论 -
JQuery选择器
选择器一、基本选择器二、层次选择器三、过滤选择器1、基本过滤选择器2、内容过滤选择器3、可见性过滤选择器4、属性过滤选择器5、子元素过滤选择器6、表单对象属性过滤选择器四、表单选择器JQuery选择器分为基本选择器、层次选择器、过滤选择器和表单选择器。一、基本选择器(1)$(“#test”)选取id为test的元素(2)$(“.test”)选取所有class为test的元素(3)$(“p...转载 2019-10-18 10:43:20 · 133 阅读 · 0 评论 -
JQuery
jQuery入门1. 什么是jQuery它是一个轻量级的javascript类库2. jQuery优点2.1 总是面向集合2.2 多行操作集于一行3. hello jQuery实例三种方式3.1 导入js库()3.2 $(fn)做为程序入口3.3 (fn)、(fn)、(fn)、(document).ready(fn)与window.onload的区别?<%@ page l...原创 2019-07-25 23:51:35 · 247 阅读 · 0 评论 -
easyui3
学习目标学习使用前后端分离开发模式(在开发前约定数据交互的格式。)对比两种不同的开发模式:陈旧的开发模式美工(ui工程师:出一个项目模型)java工程师:将原有的html转成jsp,动态展示数据缺点:客户需要调节前端的展示效果解决:由美工去重新排版,重新选色。Vs前后端分离美工、java工程师都是独立工作的,彼此之间在开发过程中是没有任何交际。在开发前约定数据交互的格式。...原创 2019-07-30 20:52:22 · 207 阅读 · 0 评论 -
easyui2
在easyui1的基础上实现权限设置二星权限设计(用户权限多对多)1、执行数据库脚本2、修改原有的实体类3、建立实体类4、创建dao5、修改原有的dao6、新增web的方法7、新增登入界面,跳入前端树形菜单项目大体结构如下:在easyui1的基础上新加了一点直接提供代码:index.jsp<%@ page language="java" contentType="...原创 2019-07-29 19:05:46 · 175 阅读 · 0 评论 -
easyui入门
简介easyui是一种基于jQuery、Angular.、Vue和React的用户界面插件集合。easyui为创建现代化,互动,JavaScript应用程序,提供必要的功能。使用easyui你不需要写很多代码,你只需要通过编写一些简单HTML标记,就可以定义用户界面。easyui是个完美支持HTML5网页的完整框架。easyui节省您网页开发的时间和规模。easyui很简单但功能强大的...原创 2019-07-28 21:43:53 · 176 阅读 · 0 评论 -
Es6(四)
博客目标Reflect与Proxy原创 2019-11-29 09:57:01 · 115 阅读 · 0 评论 -
Es6(三)
博客目标Map的基本使用Map的迭代Map对象操作、map与array的相互转换SetMap的基本使用console.log('map的基本使用,key可以是任何类型');console.log('key是基本类型。。。。');let map=new Map();map.set('name','only老K');map.set('age',20);map.set('结婚',false...原创 2019-11-27 21:56:37 · 108 阅读 · 0 评论 -
Es6(二)
博客目标三点运算符 可变参数三点运算符 可变参数<!DOCTYPE html><html><head> <meta charset="utf-8" /> <title>es6入门</title></head><script type="text/javascript">consol...原创 2019-11-27 20:58:52 · 132 阅读 · 0 评论 -
ES6(一)
博客目标let和const关键字let特点const特点对象定义简写模板字符串箭头函数简单来一手let和const关键字let特点1.在块级作用域里有效(比如循环遍历内部就可以用let定义变量) { let a='https://blog.youkuaiyun.com/weixin_44255950'; var b='only老K'; console.log(b); ...原创 2019-11-27 15:58:35 · 1137 阅读 · 0 评论 -
SPA项目之Tab页实现
博客目标实现思路实现思路1、利用前面博客所讲的Vuex的知识;定义几个变量(相关技术)原创 2019-11-27 12:01:21 · 186 阅读 · 0 评论 -
Vue之模块语法(二)
讲解Vue的基本使用(上)1. 模板语法1.1插值1.1.1文本插值 <body> <!-- 定于vue实例的挂载边界 --> <div id="app"> <ul> <li> <h3>文本</h3> {{msg}} </...原创 2019-09-17 20:58:46 · 459 阅读 · 0 评论 -
Vue之模块语法(三)
讲解Vue的基本使用(下)2.1 样式绑定2.1.1 class绑定<style>/* 定义演样式 */ .a{ background-color: green; } .b{ background-color: red; } .c{ font-size: 60px; } </style> <body> &...原创 2019-09-18 20:40:04 · 150 阅读 · 0 评论 -
Vue路由(四)
目录使用路由:第一步:需要导入依赖第二步:定义组件第三步:编写路由集合第四步:编写路由器第五步:将路由器挂载vue上第五步:定义按钮以及容器测试结果最终文件使用路由:第一步:需要导入依赖<script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script><script src="https://cd...原创 2019-09-19 16:15:54 · 118 阅读 · 0 评论 -
安装Node.js
本章详细简介Node.js环境搭建目录下载地址解压配置环境变量新增NODE_HOME修改PATH文件测试安装是否成功配置npm全局模块路径和cache默认安装位置验证安装结果版本验证(同步骤3.3,注2)查看淘宝镜像设置情况查看npm全局路径设置情况如何运行下载的Node.js项目结果图:下载地址https://nodejs.org/zh-cn/download/选择相应的版本下载,本章使...原创 2019-09-20 11:10:05 · 390 阅读 · 0 评论 -
使用vue-cli搭建SPA项目
目录目标前提简介操作开始安装vue-cli测试是否安装成功使用脚手架vue-cli(2.X版)来构建项目出现如下代码代表成功测试并打开运行结果:简单修改搭建出来的项目vue项目结构说明修改端口号如何在SPA项目中使用路由思路操作:结果学习嵌套路由的使用实现项目大体图片注意点结果图目标使用vue-cli搭建SPA项目前提搭建好NodeJS环境可以在这里学习并且安装(我的博客)https:...原创 2019-09-25 16:41:35 · 691 阅读 · 0 评论 -
SPA项目之登录注册
目录安装开发模块检测是否安装成功SPA项目完成登录注册登录注册页跳转提供Login.vueReg.vue配置App.vuemain.js效果图:项目源码:eclipes项目:SPA项目安装开发模块在搭建好的spa项目的文件所在位置中进行安装npm install element-ui -S npm install axios -Snpm install qs -S npm inst...原创 2019-09-27 11:02:16 · 833 阅读 · 0 评论 -
SPA项目首页导航以及左侧菜单
目录安装mockjs依赖查看是否成功配置开发环境及生产环境dev.env.jsprod.env.jsmain.js测试:前台主界面的搭建拷贝组件以及配置组件配置问题一效果图退出功能Vue总线概念图解左侧树收缩功能效果:安装mockjs依赖安装方法不在啰嗦npm install mockjs -D 查看是否成功配置开发环境及生产环境dev.env.js'use strict'...原创 2019-09-28 11:16:40 · 661 阅读 · 0 评论 -
SPA项目开发之左侧树+表格+分页
目录动态树功能关闭mock.js定义变量获取数据加载数据LeftNav.vue效果图存在问题:既左侧树一起开关数据表格动态树功能关闭mock.js定义变量return { collapsed: false, menus:[] }获取数据let url = this.axios.urls.SYSTEM_MENU_TREE; this.axios.post(...原创 2019-09-28 20:01:24 · 212 阅读 · 0 评论 -
SPA项目开发之CRUD+表单验证
SPA项目开发之CRUD+表单验证准备工作提供编辑页面:Element表单验证编码提供效果图:对应阶段代码:实现表单验证编码效果图实现编辑按钮数据回显编码效果图完成表单提交编码数据删除编码最终代码准备工作提供编辑页面:<!-- 编辑界面 --> <el-dialog :title="title" :visible.sync="editFormVisible" width...原创 2019-10-09 08:48:07 · 118 阅读 · 0 评论 -
Vuex
VUEX由来安装插件安装代码前期准备Vuex取值预先存值第一种取值方式:(不推荐)第二种取值方式:效果图:Vuex存值效果图同步与异步由来安装插件安装代码npm install vuex -S前期准备创建store模块,分别维护state/actions/mutations/getters如图:index.jsimport Vue from 'vue'import Vuex...原创 2019-10-09 21:32:18 · 229 阅读 · 0 评论 -
Vuex之JWT
Jwt什么是JwtJwt的工作原理JWT组成Jwt图解Jwt实现登录验证大概思路:思路图:编码HTML5中编码最终效果图(不登录情况下)什么是JwtJSON Web Token (JWT),它是目前最流行的跨域身份验证解决方案Jwt的工作原理 1. 是在服务器身份验证之后,将生成一个JSON对象并将其发送回用户,示例如下: {"UserName": "Chongchong",...原创 2019-10-10 21:17:09 · 627 阅读 · 0 评论 -
Vue入门
Vue的简介1.上面是Vue?Vue是一个构建用户界面(UI)的[渐进式]JavaScript框架。2. 库和框架的区别2.1 库(Library),本质上是一些函数的集合。每次调用函数,实现一个特定的功能,接着把控制权交给使用者代表:jQueryjQuery这个库的核心:DOM操作,即:封装DOM操作,简化DOM操作2.2 框架(Framework),是一套完整的解决方案,使用框架...原创 2019-09-14 19:14:16 · 577 阅读 · 0 评论