- 博客(84)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 【SpringBoot】使用@Async异步操作
后台开发过程中，在一个比较耗时的操作时常常需要开一个线程来进行异步操作，在SpringBoot中提供了@Async注解，可以让我们更加快速的使用异步方法进行执行任务。1.在启动类中添加@EnableAsync注解@EnableAsyncpublic class Main { public static void main(String[] args) { SpringApplica...
2019-09-04 14:20:29
380
原创 【Vue】vue父子组件通信
1. 父组件向子组件传递父组件代码<template> <div id="app"> <h1>This is Parent component</h1> <Child :parent-word='msg'></Child> </div></tem
2018-11-23 11:56:07
550
1
原创 【Vue】Vue CLI 3 使用
vue cli 3来初始化项目脚手架跟旧版本的稍微有些区别，以下是使用步骤1.Installnpm install -g @vue/cli# ORyarn global add @vue/cli2. Create a project:vue create my-project# ORvue ui3.Runnpm run serve参考官网 https://c...
2018-11-23 11:10:25
1154
原创 【React】使用shouldComponentUpdate对组件性能进行优化
前言react中，我们通过this.setState()方法去改变自身组件的state，以及子组件的props，然后触发组件重新渲染。那么，当我们setState之后，新的state和旧的state值是一样，页面也会进行重新渲染，这是不必要的，也是损耗性能的。举例写一个demoimport React, { Component } from 'react';//子组件const...
2018-10-13 17:29:30
5787
1
原创 【兼容性】ios上设置overflow: scroll不滚动bug
背景目前遇到这么一个问题：我有一个可以向下展开的下来菜单，菜单初始高度大于300px左右，没有超过手机屏幕高度，当展开的时候如果超过手机屏幕高度时让父元素出现滚动条滚动，就是说内容的高度是动态的。描述此前我通过js动态获取屏幕高度，并设置为父元素的max-height。然后设置父元素overflow-y: scroll;起初，我大概的代码布局如下： <div className...
2018-10-13 16:35:20
22115
5
原创 【微信小程序】公共方法实现实时捕捉input输入
项目中，一个表单中经常有好几个input，但是微信小程序并不像vue那样实现双向绑定，所以我们要自己去实现当用户输入的时候，实时获取用户输入的值。方法比较简单，就两个步骤。1.wxml <input data-name='form.base.name' bindinput="inputChange" name="text" value="{{ form.base.name }}...
2018-10-09 10:40:37
2827
原创 vue+element中自定义表单校验特殊字符
本次项目基于vue和element-ui，需要在前端用户输入的时候去校验输入的内容中是否含有特殊符号，如果有，则提示用户不支持输入特殊符号。校验规则方法export function checkSpecificKey(str) { var specialKey = "[`~!#$^&*()=|{}':;',\\[\\].<>/?~！#￥……&*（）——|{}...
2018-09-22 16:07:23
9707
3
原创 CSS实现垂直水平居中
前言面试中常常被问到，如何使用css来实现一个元素的垂直水平方向上居中，特别是笔试题的时候，这道题目的出现频率还是比较高的，当然，在我们的生活中，也常常会有垂直水平居中的需求。css实现垂直水平居中的三种方案### 1.容器内元素display:inline/inline-block 这种情况就比较容易了，直接设置容器的text-align就可以实现内容元素的水平居中，设置垂直居中...
2018-06-11 16:45:48
1136
原创 antd（1）-设置RangePicker选择区间和默认选择时间
安装并引入momentimport moment from 'moment'设置区间和默认选择时间const dateFormat = 'YYYY-MM-DD'// 默认选择时间为最近7天const defaultSelectDate = { startDate: moment().startOf('day').subtract(6, 'days'), endDate: momen
2018-04-16 14:17:41
30922
6
原创 ES6（1）—promise学习
学过android的人都知道，java是基于多线程的，当需要执行一个耗时的操作，比如请求服务端的数据，此时往往需要开一个线程来执行。 但是在我们的js中，是单线程的，请求网路数据的话，我们无法判定什么时候会返回，如果网络情况不是很好的话那么就会很慢。所以不可能去等待他请求完成才去进行下一步操作。所以我们需要异步去请求数据，但是我们又需要知道请求的结果，此时我们就需要一个接口回调来告知我们这个请
2018-04-16 00:22:58
275
原创 React学习笔记（3）—循环渲染组件
项目中经常遇到拿到一个数组数据，用来循环渲染在html模板中的场景。比如我有以下的数据：export default[ { link:"/", label:"首页", subMenu:[] }, { link:"/stateProp", label:"stateProp", su
2018-04-14 17:39:57
22200
原创 Webpack—配置路径别名
模块化开发项目中，比如vue和react等，经常需要import不同的js或者css模块到当前目录，那么如果路径比较深的话使用相对路径就比较麻烦，而且在文件迁移的时候，如果在不同的目录下边，又得改变以下引入的路径。所以我们可以使用webpack配置路径别名，在引入的时候我们直接使用这个别名，就可以正确的指向。我的项目目录如下： 在webpack.config.dev中的resolve下的alia
2018-04-14 15:51:04
19812
2
原创 React学习问题汇总（1）—解决antd与css-module冲突
使用任何一个框架，或者组件库都要做好碰到各种各样坑的准备。咱们心态要好。这篇文章主要讲解【如何解决antd与css-module冲突】这个小小坑。在webpack.config.dev中的module分别对依赖和src进行配置即可： { test: /\.css$/, exclude:[/node_modules/], ...
2018-04-14 14:10:17
7457
2
原创 React学习笔记（2）—使用create-react-app自动化构建项目
使用create-react-app自动化构建项目$ cnpm install -g create-react-app$ create-react-app react-learning$ cd react-learning/$ npm startcreate-react-app是基于webpack+es6的react项目自动化构建工具，假设您已经安装好node npm cnpm...
2018-04-11 23:31:30
987
原创 React学习笔记（1）—初识React
写一个简单的Hello Word程序<!DOCTYPE html><html><head> <meta charset="UTF-8" /> <title>Hello React!</title> <script src="https://cdn.bootcss
2018-04-11 14:18:28
268
1
原创 router-link传递参数并获取
跳转链接：<router-link :to="{path:'libraryDetail/', query:{library_id:data.library_id}}">获取参数：library_id = this.$route.query.library_id;
2018-03-16 16:45:56
24019
原创 JS通过url获取参数
//获取url中的参数function getQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); var result = window.location.search.substr(1).match(reg); if (result != null)...
2018-03-15 20:31:57
512
原创 element-ui中下拉菜单子选项click事件不触发问题
将@click改为@click.native='logoutHandle';即可监听选项的点击事件。 退出
2018-02-05 17:14:40
12245
3
原创 github中提交预览演示静态页面
有时候我们写的开源的项目，可能有一些打包出来的静态页面需要直观的展示给他人，github上我们除了可以上传源码之外，还可以上传我们的打包出来的静态页面，用户通过访问相应的链接就可以直接访问到这些页面。1--使用git checkout -b gh-pages在你本地切一个gh-pages的分支2-打包你的项目，将打包出来的页面（我这里打包出来的是dist目录,注意如果你的gitignore
2018-02-04 23:45:01
904
原创 webpack配置多页面项目
相信经常使用webpack的人已经深刻体验到自动化工具给我们带来的便利。我自己最常用的是vue,平时就是使用vue-cli或者nuxt构建的项目，聪明的前辈已经为我们配好了项目，可以让我们不必去配置就可以轻松使用。然而在真正的项目中，我们常常需要写一些简单的页面，并不基于vue这样比较大的框架，比如我明天上班就要做的这个公众号介绍，只有几个页面，但是我又希望能使用webpack来辅助我更好完成
2018-02-04 23:21:58
14125
3
原创 git添加远程仓库
在git服务器已经搭建好的情况下，仓库：1-进入你服务器的git目录下：2-使用git init --bare test.git 初始化一个名为test的仓库；3-使用chown -R git:git test.git 将原本ownner为root改为git所有4-本地新建一个空目录，进入这个空目录下，通过： git clone [email protected]:/var/git/te
2018-02-04 22:04:27
381
原创 a标签拨打电话，打开qq，table消除表格间隙
拨打电话：a href="tel:020-8888888">a>打开qq:a class="o-btn" href="http://wpa.qq.com/msgrd?v=3&uin=您的qq&site=oicqzone.com&menu=yes">联系客服a>table消除表格间隙：table
2018-02-04 21:37:47
854
原创 vue中解决v-for使用报红并出现警告问题
代码报红对于追求优美代码的强迫症患者来说看着很不舒服，报红如下：控制台中也会有：(Emitted value instead of an instance of Error) : component lists rendered with v-for should have explicit keys. See https://vuejs.org/guide/list.html#key
2018-01-15 16:10:37
20754
原创 vue中监听路由变化
mounted(){this.currentRouterPath=window.location.pathname;},watch: {'$route' (to,from) {consolg.log("当前路由路径",this.$route.path);}}
2018-01-15 15:59:48
7126
1
原创 Nuxt.js中引入ElementUI
nuxt.config.js中配置module.exports = {/*** Headers of the page*/head: {title: 'front',meta: [{ charset: 'utf-8' },{ name: 'viewport',content:'width=device-width, initial-scale=1'
2018-01-12 16:42:01
4169
原创 Nuxt.js设置页面跳转过渡动画
1.在/assert目录下建立一个page-transletion.css文件，里面包含过渡动画内容，内容如下：.page-enter-active, .page-leave-active {transition: opacity .5s;}.page-enter, .page-leave-active {opacity: 0;}2.在nuxt.
2018-01-08 14:13:38
9186
原创 Nuxt.js关闭ESLint代码检查
使用Nuxt构建的项目，默认是开启了ESLint代码检查，我们写的代码格式一点点不符合规范，如空格太多等问题的时候，npm run dev就会报err不能正常运行，这对于新手来说是非常头痛的。当然，我们可以关掉ESLint，只需要在nuxt.config.js中注释掉以下：build: {/*** Run ESLint on save*/// extend
2017-12-29 11:31:37
9950
原创 解决iview打包时UglifyJs报错
使用npm run dev时运行是ok的，但是npm run build打包时iview报错，如下：原因是iview中使用了es6语法，然而uglifyJs是不支持的，打开我们的build/webpack.prod.conf.js文件，可以看到// UglifyJs do not support ES6+, you can also use babel-minify
2017-12-25 15:44:41
7813
2
原创 解决ivew引入的字体图标报错
将build/webpack.prod.conf.js 中的module: {rules: utils.styleLoaders({sourceMap: config.build.productionSourceMap,extract: false,usePostCSS: true})},中的extrat改为false，就可以了，这是我改过后的。
2017-12-25 15:19:23
2256
1
原创 mysql报错Access denied for user 'ODBC'@'localhost' (using password: N O)解决
在my.ini文件中的 [mysqld] 添加 skip-grant-tables这一句。然后net stop mysql停止mysql;然后net start mysql重启即可。
2017-09-20 17:58:14
2722
1
原创 MySql下载、配置、安装、启动
1.下载进入mysql官网进行下载，选择适合你的操作系统，我选择的如下：点击download你会进入如下页面，以上两个按钮分别是登录和注册，因为我们一般使用不到收费的功能，所以选择底下的No thanks, just start my download.点击下载即可。下载完成之后解压，放在你目录下，此目录将作为你的安装目录，我的是：D:\software\mys
2017-09-20 17:13:04
636
1
原创 微信小程序多行省略
.module-news .news-title{ height: 60px; overflow: hidden; width: calc(100% - 100px); box-sizing: border-box; padding: 0 10px; display: -webkit-box; word-break: break-all; text-overflow
2017-09-05 15:19:00
4314
原创 微信小程序wx.navigateTo页面不跳转
今天在做微信小程序的时候，做的商品购买流程。流程是这样的：商品展示-->商品详情-->下单页面-->下单详情页面-->支付结果页面-->跳转订单详情页面。但是在支付成功之后，点击按钮跳转，发现怎么也跳转不了到订单详情页面，前后log都能打印出来，证明已经执行了wx.navigateTo方法，但是跳转不成功，而且，坑爹的是也不报错。翻看微信小程序开发文档，参考链接：https://m
2017-09-01 15:30:34
28403
原创 解决git pull/push每次都需要输入密码问题
如果我们git clone的下载代码的时候是连接的https://而不是git@git (ssh)的形式，当我们操作git pull/push到远程的时候，总是提示我们输入账号和密码才能操作成功，频繁的输入账号和密码会很麻烦。解决办法：git bash进入你的项目目录，输入：git config --global credential.helper store
2017-09-01 14:28:28
87900
14
原创 angular的http请求本地文件出现跨域提醒
用angular测试请求本地的json数据，请求出错，提示跨域，我的代码如下： angular使用http请求数据 angular使用http请求数据 请求结果：{{resultData}} var module=angular.module("app",[]); module.controller("testCtrl",funct
2017-08-31 18:00:42
2691
原创 解决Echarts使用tab切换时只显示第一个tab中图表，其他tab中图表不显示或显示不全问题
近期项目中也使用到了Echarts来画图表，也是两个tab切换页面中都存在图表，页面加载完成后都对所有图表进行了初始化和绘制，然而在tab切换中出现了如下动图中的问题：图中可以看到，第一个tab显示是很正常的，但是第二个tab中内容显示不完整。我的解决方式如下：1--在tab导航中加入radio单选按钮并隐藏，当第二个tab被选中的时候，再初始化图表数据
2017-08-10 11:10:08
21439
28
原创 微信小程序checkbox选中改变样式
本篇文章主要讲解在微信小程序中如何通过checkbox选中和未选中来改变checkbox的样式，效果如下：原理：通过serviceValChange来监听所有checkbox的变化，监听函数通过e.dtail.value得到一个被选中的数组，通过选中数组checkArr[]，来给原先的数据数组allGoodFilter[]的被选中对象的check属性置true，没有被选中的置f
2017-07-13 11:51:30
27365
3
原创 微信小程序Radio选中样式切换
本篇文章主要讲解在微信小程序中如何根据Radio选中来切换样式。效果如下：原理主要是通过判断一个radio-group中哪个被选中，就让它加上一个“active”的样式。代码如下： 人气 销量
2017-07-06 00:09:01
10879
2
原创 微信小程序获取当前所在城市
本篇文章主要讲解在微信小程序中，如何利用微信自带的api（wx.getLocation()）结合百度地图的逆地址解析api来获取当前所在城市名。实现起来也比较简单，步骤为：1--利用微信小程序接口 wx.getLocation() 获取当前经纬度。使用简单，具体可以参照微信小程序api。https://mp.weixin.qq.com/debug/wxadoc/dev/api/loca
2017-07-04 12:26:48
32319
10
原创 微信小程序使用字体图标
项目中常常需要使用到字体图标，微信小程序中使用字体图标与在平常的web前端中类似但是又有区别。下面以使用阿里图标为例子讲解如何在微信小程序中使用字体图标。第一步：下载需要的字体图标进入阿里图标官网http://iconfont.cn/搜索自己想要的图标，如这里需要一个购物车的图标，流程为：搜索“购物车”图标--->点击“添加入库”-->点击购物车进入购物车-->点击下载代码按钮。
2017-07-03 19:29:09
85680
17
空空如也
jsonp不支持post方法，那前端中如何用post方法跨域提交数据的?
2017-03-07
TA创建的收藏夹 TA关注的收藏夹
TA关注的人