pinbolei的博客_CSDN博客-前端,vue,javascript领域博主

原创 php使用redis的GEO地理信息类型实现经纬度计算排序

php使用redis的GEO地理信息类型实现经纬度计算redis3.2中增中了对GEO类型的支持，该类型存储经纬度，提供了经纬设置，查询，范围查询，距离查询，经纬度hash等操作。<?php $redis = new Redis();$redis->connect('127.0.0.1', 6379, 60);$redis->auth(''); //添加成员的经纬度信息$redis->rawCommand('geoadd', 'citys', '116.40',

2020-07-20 16:45:08 186

原创 JavaScript 的顺序执行执行机制

先上一个今日头条的面试题async function async1() { console.log('async1 start'); await async2(); console.log('async1 end');}async function async2() { console.log('async2');}console.log('script start');setTimeout(function() { console.log('setT

2020-06-19 14:35:03 91

原创 axios请求失败，如何获取接口返回的状态码及错误信息

如果axios请求失败，如何获取接口返回的状态码及错误信息？方法如下axios.get('api/test') .catch(function (error) { if (error.response) { // The request was made and the server responded with a status code // that falls out of the range of 2xx console.log(error.re

2020-06-19 13:46:54 306

原创 vue react 微信H5支付填坑商家参数格式错误，存在未配置的参数...

vue react 微信H5支付填坑商家参数格式错误，存在未配置的参数…这或许是你看到最完的整微信H5支付几大问题的解决方案因为项目中使用到了支付，当前国内支付无非就支付宝、微信、银联这几种方式，支付宝和银联支付今天暂时不讨论，搞过的都清楚，支付宝还是比较简单的，相对于前端来说，不会太复杂，几乎接近于完美（这么说人也是做支付的），而微信就真的额有很多坑了！1.商家存在未配置的参数，请联系商家解决说起来，真是欲哭为泪，尤其是使用vue react等单页面应用开发项目的，多少一开始都很头大，我一开始

2020-05-22 15:10:20 341 1

原创 js函数节流、防抖

js 函数节流、防抖新建index.js将下面代码复制到index.js中/** * 函数防抖 (只执行最后一次点击) * @param fn * @param delay * @returns {Function} * @constructor */const debounce = (fn, t) => { let delay = t || 300 let tim...

2020-04-30 08:21:18 48

原创 js 判断数组中是否包含某元素的方法

简述 js判断数组中是否包含某元素的方法1.array.indexOf(item,start)：元素在数组中的位置,如果没与搜索到则返回 -1参数描述item必须。查找的元素。start可选的整数参数。规定在数组中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数，则将从字符串的首字符开始检索。实际用法...

2020-03-31 08:30:51 86

原创 js 数组与字符串的相互转换

js 数组与字符串的相互转换1.数组转字符串let a = ['苹果', '黄桃', '樱桃', '橘子']let b = a.join(' | ')console.log(b) // 苹果 | 黄桃 | 樱桃 | 橘子2.字符串转数组let a = '苹果,黄桃,樱桃,橘子'let b = a.split(',')console.log(b) // ["苹果", "黄桃"...

2020-03-31 08:23:28 36

原创移动端，用flex弹性盒模型布局实现头部、底部固定，中间内容区可滑动浏览的效果

H5开发移动端项目时，常常会遇到此类问题，顶部navbar，底部tabbar,中间滑动展示内容，如果用position:fixed;往往会出各种问题，这时，你不如考虑一下flex布局，在移动端上使用，是真的香！1.css部分 body{ padding: 0; margin: 0; } html,body{ ...

2019-12-25 08:32:53 382

原创 H5移动端开发注意事项

一、关于meta(一)、常用的公共meta属性1、viewport<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no" />属性属性width=device-width...

2019-12-25 08:25:25 78

原创 js 判断手机系统是android还是ios

var u = navigator.userAgentvar isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1 //android终端var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/) //ios终端alert('是否是Android：'+isA...

2019-11-25 08:23:23 51

原创 js 函数节流、防抖

新建index.js将下面代码复制到index.js中/** * 函数防抖 (只执行最后一次点击) * @param fn * @param delay * @returns {Function} * @constructor */const debounce = (fn, t) => { let delay = t || 300 let timer return...

2019-11-25 08:19:21 37

原创关于移动端flexible适配ipad和ipad Pro

当我在做一个H5的项目时，通过是flexible.js实现了rem自适应，但是我发现在iPad和iPad Pro中显示有问题，由此记录下解决这个问题的方法解决移动端flexible适配ipad和ipad Pro因为我的项目是使用的vue-cli框架，所以直接在inedx.html中加入如下代码即可<script> // 适配pad padPro /(pad|pod|iP...

2019-10-25 13:30:03 679 1

原创 vue移动端项目-click事件在浏览器中延迟300ms的解决方法

在H5页面移动端项目当中，click事件在浏览器中会有300ms的延迟，这个也是移动端开发中常见的问题之一，今天就这个问题说一说解决方法解决click点击事件300ms延迟在vue项目中，可以通过引入fastclick第三方依赖包来解决。1、安装fastclick依赖npm install fastclick ---save2、在main.js中引入并使用import fastCli...

2019-09-03 16:27:11 152

原创 js判断一个字符串中出现次数最多的字符及次数

js判断一个字符串中出现次数最多的字符及次数var str="aagaabbbabtavnahaa";function maxstringload(str) { var obj={}; for(var i=0;i<str.length;i++){ var key=str[i];//key中存储的是每一个字符串 if(obj[key]){//判...

2019-08-15 15:25:24 62

原创 git全局创建或者修改用户名和邮箱

git的文件中查看局部信息git config user.namegit config user.emailgit的文件中查看全局的信息git config --global user.namegit config --global user.emailgit的文件中修改局部的信息git config user.name "name"git config user.email ...

2019-07-21 17:16:13 125

原创 js数组中对象去重的方法

简单说一下数组中对象去重的方法假设当前有这样一个数组 let arr = [{ key: '01', value: '乐乐' },{ key: '02', value: '博博' },{ key: '03', value: '淘淘' },{ key: '04', v...

2019-06-17 08:35:00 4827 1

原创解决Vue 2.0在IE11版本浏览器中的兼容性问题

用vue2.0开发做兼容时，你可能会发现vue项目在IE11版本浏览器中是空白的。。。看到空白的页面你可能会蒙蔽几秒钟，没事，下面我们就来解决这个问题~让IE11支持vue2.0首先用npm 安装babel-polyfillnpm install --save-dev babel-polyfill 然后在webpack.base.conf.js 文件中修改 module.exports ...

2019-06-05 17:21:58 2236

原创 vue电商开发记录3—实现返回顶部组件

简单说一下用vue实现一个返回顶部组件其实不光电商平台，一般的网站也会有返回顶部的功能，算是一个很常见的功能，有些ui框架中也会有自己的返回顶部的组件今天说一下如何自己封装一个返回顶部的组件返回顶部html部分<template> <div class="back-top"> <a title="返回顶部" href="javascript...

2019-05-13 09:26:26 401 1

原创 element-ui table列表自定义表头，修改列标题样式、添加tooltip

在之前的博客中，提到在element-ui table列表自定义表头，修改列标题样式、添加tooltip，需要render-header，但是在2.4.11及以后，element-ui官方已经更新了，并添加了自定义表头的方法为了广大的群众少走弯路，我觉得还是有必要更新一下，如果element-ui版本是2.4.11以下，可以参考上个关于自定义表头的博客，如果是2.4.11及以上版本可参考本文...

2019-05-06 15:00:11 10695

原创 vue电商开发记录2—实现公告轮播组件

简单说一下用vue实现一个电商公告轮播组件电商平台中常会有公告轮播图，虽然我浏览电商网站的时候，常常会忽略掉它~~~，emmmmm…，切回正题，今天分享一个电商公告轮播的小栗子，仅供参考html部分<template> <div class="swiper">  <div class...

2019-05-06 09:01:52 434

原创 vue-router中query和params传参的区别

简单介绍git merge 和 git merge --no-ff的区别关注我的个人博客:https://pinbolei.github.io，获取更多内容

2019-04-29 15:48:08 194

原创 vue电商开发记录1—实现电商图片放大镜，移入放大效果

商品详情页中图片移入放大效果没有啥太炫酷的东西，仅为参考最近在重构电商网站，本想随便找个现成的插件，网上看了很多发现不是太炫酷，就是不符合需求，emmmmm…索性就参考别人的自己封装了个放大镜的组件，真香啊…你可以不会写，但一定得会copy，不废话了，上代码~~~~我们先给组件起个名，我先来，emmmmm…就叫PicZoom吧，你们随意~~1.html部分<template&g...

2019-04-22 13:35:07 1055 1

转载程序员面试时，如何向公司提问？

本文选取自阮一峰老师的文章，原文地址：http://www.ruanyifeng.com/blog/2012/08/questions_you_need_to_ask_in_an_interview.html很多人将面试看作一种单向选择，事实上，面试是一种双向选择：不仅是公司挑选你，也是你挑选公司。面试就是为双方提供互相了解的机会，公司在评估你，你也在评估公司。面试官也知道这一点，所以他们有...

2019-04-15 09:26:44 1174

原创 css实现盒子内部 div水平垂直居中

总结一下利用css实现垂直居中的几种方法

2019-04-05 14:45:44 1108

原创 git fetch和git pull的区别

1.git fetchgit fetch 相当于是从远程获取最新到本地，不会自动mergegit fetch orgin master //将远程仓库的master分支下载到本地当前branch中git log -p master ..origin/master //比较本地的master分支和origin/master分支的差别git merge origin/master //进行合...

2019-02-25 08:34:10 66

原创 git常用基本命令（下）

简单介绍一下git常用的基本命令和Git Flow工作流程1.开新分支

2019-02-12 16:34:29 93

原创 git常用基本命令（上）

1.克隆现有的仓库git clone [url]2.初始化仓库git init3.把文件提交到暂存区git add4.把所有的文件提交到暂存区git add . 或 git add *注：包括文件内容修改(modified)以及新文件(new)，但不包括被删除的文件5.提交文件到仓库git commit -m '对本次提交的描述'注：添加的描述最好是英文，中文也可以6.检查...

2019-01-21 17:21:21 75

原创 git flow工作流

git flow使用介绍

2019-01-15 12:02:41 1129 1

原创 vue组件 keep-alive

keep-alive适用于动态组件中，当在组件之间切换的时候，你有时会想保持这些组件的状态，以避免反复重渲染导致的性能问题。keep-alive让组件实例能够被在它们第一次被创建的时候缓存下来。注意这个 &amp;amp;amp;amp;amp;amp;amp;amp;lt;keep-alive&amp;amp;amp;amp;amp;amp;amp;amp;gt; 要求被切换到的组件都有自己的名字，不论是通过组件的 name 选项还是局部/全局注册。Props：include -

2019-01-04 10:52:13 95

原创 vue组件间通信

简单说一下vue组件间的通信1.父组件向子组件传递数据通过 Prop 向子组件传递数据1.在父组件中注册子组件2.在子组件中声名props,接收从父组件传过来的值3.在子组件的标签中使用props创建的属性4.在父组件中，把要传给子组件的值赋值给props创建的属性示例：&amp;amp;amp;amp;amp;amp;amp;lt;body&amp;amp;amp;amp;amp;amp;amp;gt; &amp;amp;amp;amp;amp;amp;am

2019-01-02 09:57:02 114

原创 CSS选择器和CSS3属性

1、CSS3的概念和优势A、CSS3的概念：CSS3并不是一门语言，我们知道css是层叠样式表，是一种样式语言，是用来告诉浏览器如何渲染页面的。css3是css规范的最新版本，在css2.1上增加了很多强大的新功能，用来帮助开发人员解决一些问题，并且不再需要非语义化标签，复杂的js脚本和图片，例如圆角、多背景、透明度、阴影等等。css2.1是单一的规范，而css3被划分成几个模块组，每个模块...

2018-12-13 08:36:01 263

原创 CSS3弹性盒和媒体查询、响应式布局

一、怪异盒模型的简介二、弹性盒模型Flexbox布局（Flexible Box）模块(目前处于W3C工作草案)旨在提供一个更佳有效的布局方式，更好的控制项目的对齐和自由分配容器空间，即使它们的大小是未知的或动态的。因此得其名&amp;amp;amp;amp;amp;quot;flex&amp;amp;amp;amp;amp;quot;。Flex布局背后的主要思想是给容器控制项目（Flex项目）的宽度、高度的能力，使用Flex项目可以自动填满容器的可用空间（主要是适应所有类型的显示设

2018-12-12 08:58:50 740

翻译常见的网页设计错误（下）

原文地址http://blog-en.tilda.cc/articles-website-design-mistakes文章设计中的错误1.长而坚固的副本文本墙使阅读难以理解。为了便于导航，将其拆分为段落或引入诸如关键短语或图像之类的中断。文字墙很难看拉引号或图像等元素使阅读文本更容易2.标题位于前一段和下一段之间相同的距离标题不应该在类似距离的章节之间“挂起”，因为它属于下面的...

2018-12-06 16:26:43 213

翻译常见的网页设计错误（上）

原文地址http://blog-en.tilda.cc/articles-website-design-mistakes常见的登陆页面设计错误要避免1.内容不会分解为逻辑块如果将信息分组为逻辑块，则用户更容易摘要信息。将填充设置为120 px-180 px，并使用彩色背景分隔文本块。图1-1，在相关信息集之间几乎没有填充，而且这种设计需要颜色块来将内容划分为逻辑集。结果，这些信息难以...

2018-12-04 11:01:23 425

原创 vue路由打开一个新的窗口

简单说一下vue路由如何打开一个新的窗口

2018-11-29 08:47:40 7927

原创 VScode如何在浏览器中打开html文件

Vscode默认是在控制台下查看html文件，对于我们查看和调试都很不方便，那如何在浏览器中打开呢？1.新建一个HTML文件2.点击左侧的扩展，打开扩展栏3.在扩展栏的搜索栏中输入open in browser，找到open in browser这款插件，点击右下角“安装”字样即可安装。因为我已经安装了，所以再搜索不会显示安装字样4.安装完成后可以看一下这款插件的扩展文档，里面有插...

2018-11-26 10:07:47 20442 7

原创 HTML5简介

文档篇幅较长，可能需要花点时间看完消化，请耐心看完关注我的个人博客:pinbolei.cn，获取更多内容目录 1、H5的浏览器兼容 2、H5新的文档声明3、H5的特点...

2018-11-21 09:23:36 1532

原创前端vue项目国际化——vue-i18n

有时候我们的项目需要支持多种语言，切换语言设置时，就自动切换整个项目的文字显示。安装 vue-i18n// npm 安装npm install vue-i18n// script 引入&amp;amp;amp;amp;amp;amp;lt;script src=&amp;amp;amp;amp;amp;quot;https://unpkg.com/vue/dist/vue.js&amp;amp;amp;amp;amp;quot;&amp;amp;amp;amp;a

2018-11-19 09:18:40 389

原创 Element-ui自定义table表头，修改列标题样式、添加tooltip， :render-header使用简介

render-headerrender-header在官方文档中的介绍是这样的：参数说明类型可选值默认值

2018-11-14 09:21:34 28848 29

原创 Hosts 和 SwitchHosts

1.什么是 Hosts 和 SwitchHostsHostsHosts是一个没有扩展名的系统文件，可以用记事本等工具打开，其作用就是将一些常用的网址域名与其对应的IP地址建立一个关联“数据库”，当用户在浏览器中输入一个需要登录的网址时，系统会首先自动从Hosts文件中寻找对应的IP地址，一旦找到，系统会立即打开对应网页，如果没有找到，则系统会再将网址提交DNS域名解析服务器进行IP地址的解析。...

2018-11-12 09:10:12 223