2018年05月_丶乘风破浪丶

原创移动端滑动切换组件封装 vue-swiper-router

组件部分<template> <div class="main"> <div class="page-tab"> <div :class="nowPath == item.path ? 'tab-item tab-item_active' : 'tab-item'"

2018-05-30 14:54:18 6402 2

原创 react-redux中connect装饰器的使用

目的：简化代码工具：create-react-app 插件：cnpm install babel-plugin-transform-decorators-legacy –save-dev 条件：执行npm run eject命令，因为得自己配置下1、配置package.json文件 2、connect// 数据const mapStateToProps = (state) => { ...

2018-05-29 16:44:15 618

原创 npm run eject后执行npm start报错

在用creata-react-app脚手架构建react项目的时候，发现默认配置是不支持sass和less预编译的，对于习惯less写法的我来说是万万不能接受的，于是就百度查找“create-react-app配置less”，然后得出解决办法就是执行npm run eject，作用就是把之前的默认配置全部暴露出来，因此可以自定义修改webpack的配置。如图：执行成功之后再次启动项目 npm st...

2018-05-29 11:24:17 2905 1

原创微信小程序：下拉刷新，上拉加载

下拉刷新和上拉加载是两个独立又联系的功能，下拉刷新除了重新请求服务器数据外还要对之前的状态和页码进行初始化，而上拉加载需要服务器端有分页机制，和内存中数据的添加和页码的对应变化，以及状态的变化。小程序对下拉刷新是有一定支持的，那就是json文件里的enablePullDownRefresh参数，设置enablePullDownRefresh后会触发js文件中的onPullDownRefresh方...

2018-05-23 11:02:10 1598

原创微信小程序开发之选项卡(窗口顶部TabBar)页面切换

总算做出来了.分享出来看看.先看效果:再上代码:1.index.wxml[html] view plain copy <view class="swiper-tab"> <view class="swiper-tab-list {{currentTab==0 ? 'on' : ''}}" data-current="0" ...

2018-05-23 10:53:07 610

原创【移动端实现】相机唤起及图片上传功能（包括微信）

参考了百度移动端实现方式。。。代码很简单，对就这一句！[html] view plain copy<input type="file" accept="image/*" onChange={this.choosePhoto}/> 其他实现方式增加mutiple ，但是兼容性不好，部分华为手机不兼容[html] view plain copy<input type="fil...

2018-05-18 00:21:20 1380

原创微信支付

//微信支付方法（点击按键调用）let wx = require('weixin-js-sdk');/*微信支付方法获取微信加签信息@param{data}:获取的微信加签@param{cb}:成功回调*/let wexinPay = (data,cb,errorCb) => { let appId = data.appId; let timestamp ...

2018-05-17 10:01:28 301

转载七牛图片上传的使用心得

我写了一篇有关七牛的教程：http://blog.csdn.net/shuzipai/article/details/74573953我使用七牛是因为我懒得管理图片，也懒得处理图片缩放之类的东西。最主要的，感觉用七牛逼格比较高。傻瓜式的顺序：注册七牛账号->实名认证->充值10块钱->开始使用这时候你去个人中心->密钥管理，可以看到AK和SK两个值，这两个值是七牛确认是谁在...

2018-05-16 22:30:26 587

原创 mescroll.js下拉刷新使用时应该注意的问题（卡顿情况，有时候会拉不动）

在iOS的微信,QQ,Safari等浏览器, 列表顶部下拉和底部上拉露出浏览器灰色背景, 卡顿2秒 ?这个问题只存在 iOS 浏览器; android,PC是正常的; 原因是 iOS 自身的回弹效果导致的, 解决方法如下: 1. mescroll.min.css 和 mescroll.min.js 更新到1.3.0 版本 (所有版本都向下兼容,放心升级, 可通过输出mescroll.version...

2018-05-14 12:00:37 6468 2

原创使用 vue-infinite-loading 做移动端的滚动加载

1.安装vue-infinite-loading npm(cnpm) install vue-infinite-loading --save2.项目里面引入：ES6引入：import InfiniteLoading from 'vue-infinite-loading';export default { components: { InfiniteLoading, ...

2018-05-12 13:00:08 854

原创在windows下运行docker的问题【Error getting IP address: ***】

环境配置系统：windows 10docker：Docker Toolbox https://www.docker.com/products/docker-toolbox问题描述windows下安装完Docker Toolbox后运行Docker Quickstart Terminal可能会看到如下错误Creating Machine default...Running pre-create c...

2018-05-10 17:24:52 6283

原创 vue按需加载组件-webpack require.ensure

使用 vue-cli构建的项目,在默认情况下 ,执行 npm run build 会将所有的js代码打包为一个整体,打包位置是 dist/static/js/app.[contenthash].js 类似下面的路由代码router/index.js 路由相关信息,该路由文件引入了多个 .vue组件import Hello from '@/components/Hello'import Prov...

2018-05-10 15:48:08 357

原创 Express配置SPA-History模式

首先讲一下什么是history模式，路由默认是hash默认，比如hash模式在路由会这么匹配http://www.xx.com/#/userhistory模式的路由会这么匹配，两者的区别就是history会使URL更美观http://www.xx.com/userApache和Nginx配置比较简单，直接拿官方的例子过来Apache配置<IfModule mod_rewrite.c&gt...

2018-05-09 23:47:29 1900

原创深入研究-webkit-overflow-scrolling:touch及ios滚动

1. -webkit-overflow-scrolling:touch是什么？MDN上是这样定义的：-webkit-overflow-scrolling 属性控制元素在移动设备上是否使用滚动回弹效果.auto: 使用普通滚动, 当手指从触摸屏上移开，滚动会立即停止。touch: 使用具有回弹效果的滚动, 当手指从触摸屏上移开，内容会继续保持一段时间的滚动效果。继续滚动的速度和持续的时间和滚动手势的...

2018-05-08 10:26:26 1878

转载详解Vue微信公众号开发踩坑全记录

本文介绍了Vue微信公众号开发踩坑全记录，分享给大家，也给自己留个笔记。需求微信授权登录（基于公众号的登录方案）接入JS-SDK实现图片上传，分享等功能现状及难点采用的Vue框架，前后端分离模式（vue工程仅作为客户端），用户通过域名访问的是客户端，但是微信授权中涉及签名和token校验依赖服务端JS-SDK需要向服务端获取签名，且获取签名中需要的参数包括所在页面的url，但由于单页应用的路由特殊...

2018-05-07 13:54:34 8850 2

原创 vue 单页项目教程--微信公众号(微信支付遇到的坑)

1首先。跳到选择支付页面reservedPay，保证reservedPay页面为二级页面。 submit:function(){ window.location.href="/Pay/reservedPay; } { path: '/Pay/reservedPay', component: function (resolve) { require([...

2018-05-07 11:48:31 659

原创 mongoVUE 连接MongoDB3.2不能正常显示collection的问题

引擎的原因，只要降到2.X版本就可以显示了 3.x默认是wiredTiger 引擎，2.x默认是mmapv1 引擎打开MongoDB服务器，打开管理软件连接到服务器，此时如果数据库是默认条件下打开的，那么MongoVUE的collection列表是没法检测到，也没法新建的。这是因为MongoDB 3.2之后默认启动的是wiredTiger引擎，这个引擎和之前的引擎不同，而管理软件匹配的还是之前的引...

2018-05-06 14:27:18 406

原创 MongoDB+MongoVUE安装及入门

前言及概念环境安装MongoDB的安装MongoVUE安装建立连接基础操作创建表添加数据查询日期查询排序Sort查询字段Fieldsskip跳过Limit分页修改删除数据前言及概念据说nodejs和mongoDB是一对好基友，于是就忍不住去学习了解了一下MongoDB相关的一些东西，那么，MongoDB是什么？这里的五件事是每个开放人员应该知道的：MongoDB是一个独立的服务器;如MySQL或...

2018-05-06 14:26:44 104

原创利用 Express 托管静态文件

通过 Express 内置的 express.static 可以方便地托管静态文件，例如图片、CSS、JavaScript 文件等。将静态资源文件所在的目录作为参数传递给 express.static 中间件就可以提供静态资源文件的访问了。例如，假设在 public 目录放置了图片、CSS 和 JavaScript 文件，你就可以：app.use(express.static('public'))...

2018-05-05 20:27:04 187

原创微信H5开发，怎样禁止手机横屏

最近开发微信H5时遇到一个非常蛋疼的问题，就是手机横屏显示时，排版出问题了，严重变形。就像下面这样。页面一团糟在网上找了很多方法，下面网友的建议方法：网上的一些方法后来我就把各个大神做的H5都拿出来看看，发现基本上有问题。也就是说横屏的体验是很差的，毕竟微信H5是二次开发，没有权限获取相关接口。折腾了一天了，没有太好的解决方法。所以在开发的时候，就是基于手机竖屏了，也就是让所有的图片，标签都旋转9...

2018-05-04 14:05:03 23198

原创 vue 项目如何引入微信sdk接口的方法

做微信的网页基本上都要接入微信的sdk，我在做的时候，也颇费了一番功夫，然后就想记录一下，供自己日后翻阅，以及让有需要的朋友可以做一下参考，如果喜欢的可以点波赞，或者关注一下，希望可以帮到大家。安装sdk?1npm install weixin-js-sdk --save开始之前大家可以先读一读微信公众号的接入文档，vue是单页面项目，比如你想要接入微信分享功能，分享功能在每个路由地址都要有，...

2018-05-04 13:37:58 4068

原创删除本地git的远程分支和远程删除git服务器的分支

在项目中使用git管理代码后，有些时候会创建很多不同名称的分支，以此区分各个分支代码功能。而随着代码的合并，以前的分支就可能不再需要保存了，所以就要对没有用的分支进行删除，包括紧急回滚时从中抽取某一个版本记录所创建的临时分支。这时候就可以使用下面的命令：1.列出本地分支：git branch2.删除本地分支：git branch -D BranchName其中-D也可以是--delete，如：...

2018-05-04 13:36:25 267

转载 vue下拉加载插件之vue-infinite-loading

假设你的项目已经可以正常运行(1) 安装淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org （安装插件有时需要翻墙，为了避免这种情况我直接安装了淘宝镜像） (2) 安装插件 cnpm install --save vue-infinite-loading(3) 在需要的页面中引入vue-infinite-l...

2018-05-03 23:29:00 926

原创 vue 微信中设置title插件

推荐使用 vue-wechat-title插件npm install vue-wechat-title --save 下看后我的使用方式1. 在 main.js 中 import VueWechatTitle from 'vue-wechat-title'; Vue.use(VueWechatTitle) 这样就能用了2. 路由中加下 title{ path: '/Login',...

2018-05-03 11:20:11 871

原创使用vue开发微信公众号下SPA站点的填坑之旅

直接放最佳实践，解决SPA下使用jSSDk和微信支付问题注意，下面是我总结的最佳实践，但并非唯一方法vue-router路由使用hash模式(#分隔)项目url(即js中location.href)分隔符#前面需要增加一个问号(?),即location.hash不能为空，至少有一个问号。如果没有问号，则js跳转到有问号的url上，跳转代码见后面微信模板消息部分项目url location.path...

2018-05-03 10:38:30 404

原创 VUE项目引入微信jssdk

我们的一个vue + webpack的 SPA项目需要在微信中使用，因此需要导入微信的jssdk库。通过搜索发现npm有微信jssdk的依赖包： weixin-js-sdk, 于是导入依赖包npm i -S weixin-js-sdk1前端页面Usageimport wx from 'weixin-js-sdk'export default { created(){ let ...

2018-05-03 10:36:06 4153

前端kk的博客