水冰月的小兔子-CSDN博客

原创 H5移动端实现左右滑屏切换页面

项目中需要实现的一个需求是顶部有一个tab选择框,点选某一个tab的时候切换页面，并且支持手势滑动，左滑右滑可以同点选tab一样切换页面。根据项目中选用的ui组件cube-ui为基准查看了一下可实现的方案，比如可以直接用swipe或者是slide实现，但根据之前的实现方案来看，多少都会有些问题，尤其是在页面嵌套了很多层的垂直和水平滚动的情况下，会让滚动很不流畅。于是选用了移动端的touch事件...

2020-01-09 18:40:56 10904 4

原创 react中报错Objects are not valid as a React child问题解决

今天在react跳转页面的时候报了一个Objects are not valid as a React child (found: object with keys {id, materialsCode, storageLocationCode, deleteStatus, statusCode, storageLocationName}).从字面意思看来的话是渲染了对象导致的，所以问题根本解...

2019-07-04 00:05:41 52767

原创基于Session的单点登录(SSO)流程

一.背景做项目过程中遇到了所做的系统需要和用户的门户还有app联通，并且支持单点登录的问题，本身自己的系统身份验证采用了基于token的验证方式。二.方案比较用户在登录的时候需要输入用户名和密码等服务器知道的信息来确认用户身份进行身份验证，常见的身份验证方式有两种：基于session的验证Session 方案中，登录成功后，服务端将用户的身份信息存储在 Session 里，并且服务端会...

2019-07-01 03:03:07 3651

原创前端使用vux中md5加密方法

在进行页面的账号密码等输入信息传输的时候，需要用到加密方法，那么前端可以使用简单的md5来进行加密若是在项目中引入了vux，则可以直接用vux中的md5加密方式，首先导入：import { md5 } from 'vux'然后使用：md（‘需要加密的内容’）那么信息就可以直接加密传输了...

2019-03-29 16:55:38 479 2

原创 indexDB

现有的浏览器存贮方案：1.cookie:大小不超过4kb,每次请求发回服务器2.localStorage:大小2.5MB到10MB之间，不提供搜索功能，不能建立自定义索引indexDB是浏览器提供的本地数据库，可以被网页脚本创建和操作，允许存贮大量数据，提供查找接口，能建立索引。数据库类型而言，indexDB更接近NoSQL数据库。indexDB的特点：1.键值对储存：in...

2018-12-31 10:35:22 9176

原创微信公众号开发(5)-调用jssdk获取地理位置经纬度及百度api获得城市

调用微信的jssdk需要先绑定js安全域名，这个在微信公众号后台自己设置就可以了。还需要引入js文件，但由于我使用了vux，它里面的WeChatPlugin这个插件可以直接用commonJS方式引用，不需要再引用jsw文件，所以我直接在main.js中引入了插件，代码如下import { WechatPlugin } from 'vux'Vue.use(WechatPlugin)co...

2018-10-19 18:13:49 12050 1

原创 vue.router中replace需要返回两次问题及解决方案

问题：现有三个页面a , b , c , 递进关系，a页面router.push跳转至b，b再router.push跳转至c，c使用$router.replace()回到b，然后点击b页面的返回键，需要点击两次才能回到a页面需求：c保持router.replace至b方式不变，b页面返回键点击一次正常返回a页面解决方法：使用replace方法之后，再使用router.go(-1)方法返回一次...

2018-10-18 14:59:17 13111 10

转载使用CSDN-markdown编辑器

markdown使用指南使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入使用Mark...

2018-10-18 09:48:39 137

原创 elementUI中带输入建议的input使用

项目中有一个需求是在输入框输入文字的时候带出有相应内容的提示建议，第一个想法是自己写一个定位元素控制显示隐藏，然后前端进行筛选，仔细思考之后发现有很多问题，比如前端数据需要把数据全部请求过来，但是数据非常多的时候这个方法就不适用，并且还要自己去写模糊查询，下拉框的动画等也需要自己去写，所以我就放弃了自己造轮子的想法，改用elementUI中的组件。autocomplete 是一个可带输入建议的...

2018-08-15 11:38:32 22978 10

原创微信公众号开发(4)-获取微信网页授权

微信公众号访问第三方网页的时候，需要获取微信授权，获取用户基本信息。文档如下：https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421140842在获取微信网页授权之前，需要在公众平台中配置授权回调域名。网页授权有两种scope:1、以snsapi_base为scope发起的网页授权，是用来获取进入页面的用户的o...

2018-07-30 17:32:08 491

原创解决vux的scroller组件无限加载引起的页面性能下降和页面卡顿的问题

页面列表中需要加入滑动到底部加载新数据的功能，用了vue-scroller中的infinite方法，但还是会有问题，比如有时候上拉加载两次之后就不再加载新数据，目前还没找到解决方案。因为项目中刚好引用了vux，所以就改用vux的scroller,虽然已不再维护，但基本能满足业务需求。刚开始的使用方法如下： <scroller @on-scroll-bottom="infinite" lock...

2018-06-27 17:29:02 4993 2

原创解决定位元素在页面刚开始加载时移动的问题

最近在用vue写页面的时候，用固定定位在页面底部写了一个footer,发现每次进入页面的时候，底部的footer刚开始都是从顶部移下去的，导致页面看着是需要再次加载一下，视觉效果和用户体验都很不好。刚开始觉得可能是元素的高度没有撑开的导致的，但这里是固定定位，所以不存在撑开元素的问题，因为已经脱离了文档流。从这个方面考虑的话，脱离了文档流，导致不占位置，所以当最外层的元素没有设置高度的时候，它的高...

2018-06-25 11:50:27 1522

原创利用pdf.js封装vue组件在vue中实现在线pdf查看

pdf.js是一款开源的pdf文档读取解析插件，可以直接在html中进行pdf预览。pdf可以直接下载，下载地址：http://mozilla.github.io/pdf.js/。pdf.js主要包含两个库文件，一个pdf.js和pdf.worker.js，一个负责api解析，一个负责核心解析。也可以直接进行下载使用，我这边使用的是cnpm下载。1. 安装 cnpm isntall --save ...

2018-06-20 18:27:44 8890 11

原创 vue-scroller使用指南

在页面中经常会用到滚动，下拉刷新，下拉加载等功能，vux的scroller可以使用，但是它不再维护，而且要配合load-more组件一起使用。所以一般在项目中我都是用vue-scroller.vue-scroller文档1.在项目中安装：npm i vue-scroller -S2.在main.js中引用import VueScroller from 'vue-scroller'Vue.use(...

2018-06-13 16:26:34 10781 3

原创 vuex的入门使用

需求：多个页面跳转同一个页面A，在页面A获取到一组数据的后返回上一页，然后把获取到的数据传回去。问题： 1.刚开始用路由来做，直接用的vue-router中的返回上一页方法，但是发现无法带参返回上一页 2.由于是多个页面异步的跳转同一个页面，所以返回的页面路由不确定，在页面A用带参路由跳转的方法不可行，还需要额外判断上一页的路由名称解决方案： vuex状态管理，将需要从A...

2018-06-07 15:45:39 223

原创 js数组操作（增删改，排序，深浅拷贝）

js数组操作（增删改查） unshift()//在数组头部插入一个元素 eg: `let arr1 = [1,2,3,4,5]; arr1.unshift(0); console.log(arr1);//[0,1,2,3,4,5]` shift()//移除并返回数组的第一个元素 eg: let arr1 = [1,2,3,4,5]; ...

2018-06-04 15:38:14 1652 1

原创 vue-amap基于高德地图的vue组件使用

1. 文档https://elemefe.github.io/vue-amap/#/2. 安装`npm install vue-amap --save`3. 引入地图在main.js中引入`import AMap from 'vue-amap';Vue.use(AMap);AMap.initAMapApiLoader({ key: 'your amap key', plugin: ['AMap...

2018-06-01 18:03:01 6148

原创 tomcat安装配置

1.官网下载tomcat安装包https://tomcat.apache.org/download-80.cgi根据自己的环境选择下载的版本，下载时候解压2.配置环境变量3.新增calsspath变量4.运行tomcat5.成功则配置完成...

2018-06-01 17:54:03 155

原创 js原型和原型链

首先，js中所有东西都是对象，函数也是特殊的对象，所有的东西通过object衍生出来，所以所有东西的终点都指向object.prototype另外还需要了解一下以下的几个概念：1. 函数函数申明：`function foo(){}`函数表达式：`var foo = function(){}`2.函数对象代表函数的对象就是函数对象，函数就是对象`var foo = new Function(){}t...

2018-06-01 17:44:01 141

原创 github上传项目

第一次在github上传项目的时候，我直接上传了文件夹。如下图所示，我直接将本地的文件夹拖进了里面上传。这样做的问题是，后面代码有修改或者是需要添加文件时，不知道怎么操作。于是直接用git和github创建连接，这样就可以直接提交修改。1.首先在本地的文件夹内右键git bash2.然后输入命令git init进行初始化3.然后本地创建ssh -key,首先输入命令：ssh-keygen -t r...

2018-05-17 16:04:05 274 2

原创微信公众号开发(3)-测试号使用和接口调试

当微信的测试号申请好，并且关注之后，发现它不是一般公众号一样底部有菜单并且可以看到网页内容，这是我们可以自行设置他的菜单。进入微信公众平台接口调试工具：https://mp.weixin.qq.com/debug/1.获取access_token由于我们在调试其他接口的时候需要用到access_token，所以需要先获得，appid和secret就是我们之前再申请测试号的时候自动给出的那两个信息，...

2018-05-16 18:21:35 5659

原创微信公众号开发(2)-测试号申请

由于开发的时候微信公众号的服务号还没有认证，所以使用微信测试号进行。一.微信测试号申请地址：https://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login进入网页之后直接用微信扫码登录，微信测试号就申请成功了二.测试号配置申请成功之后会有一个测试号管理界面，里面有公众号的appID等，然后在下面会有一些接口配置，js接口安全域名，测试号...

2018-05-16 18:16:56 667

原创微信公众号开发(1)-概览

一. 微信公众号了解1.文档介绍：http://kf.qq.com/faq/120911VrYVrA130805byM32u.html2.分类：（1）、订阅号：主要偏于为用户传达资讯（类似报纸杂志），认证前后都是每天只可以群发一条消息；（2）、服务号：主要偏于服务交互（类似银行，114，提供服务查询），认证前后都是每个月可群发4条消息；（3）、企业号：主要用于公司内部通讯使用，需要先验证身份才可以...

2018-05-16 15:05:43 275

水冰月的小兔子的博客