自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

赳赳万里鲲

前端技术交流

  • 博客(154)
  • 资源 (2)
  • 收藏
  • 关注

原创 019-Vuex状态管理

一、Vuex简介vue应用程序的状态管理模式。他采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。vuex包含部分ViewActionsMutationsState一句话总结上图:Vuex模块间可以共享状态。vue组件dispatch发送事件触发Actions,Actions可以进行异步请求,再去触发Mutations,Mutation...

2019-08-02 17:49:49 250

原创 018-Vue项目生成模拟数据

开发过程中,与后端未搭建好联调环境时,没有数据。此时前端无法进行测试,开发起来就比较头疼了。使用mockjs,拦截Ajax请求,并且随机生成和后端协商好的数据格式,这样即使服务端环境无法使用,前端也可以愉快的coding了。接下来聊聊它的使用方法吧:一、node环境1、在项目中初始化mock.jsnpm i mockjs2、创建mock数据文件// 引入Mock对象import...

2019-07-24 15:34:11 282

原创 010-微信小程序支付

微信小程序支付流程:上图摘自官方文档:https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_4&index=3微信小程序支付其实很简单,我把他拆成以下几个简单的步骤:1、登录获取code;2、用code向服务端换取openid;3、向服务端获取数据签名;4、调用小程序API唤起支付弹窗;data ...

2019-07-23 14:49:07 236

原创 009-用户分享(点击按钮分享)

button组件,在小程序中是一个功能强大的组件。其中有些原生组件所没有的功能。这就要归功于open-type属性。可以打开会话、获取用户信息、打开APP、打开授权设置页、分享等功能。// 1、点击去分享<button open-type="share">分享</button>// 2、监听分享:页面Page的onShareAppMessage事件处理函数。on...

2019-07-23 14:19:31 454

原创 017-vue项目config中index.js配置解析

1、build对象 对于 生产环境 的配置: index:配置打包后入口.html文件的名称以及文件夹名称 assetsRoot:配置打包后生成的文件名称和路径 assetsPublicPath:配置 打包后 .html 引用静态资源的路径,一般要设置成 "./" productionGzip:是否开发 gzip 压缩,以提升加载速度2、dev 对象下 对于 开发环境 的配置:po...

2019-07-18 17:35:22 698

原创 BFC(Block Formatting Context)

是什么,从哪里来BFC,拥有独立渲染(排版)规则来约束盒模型的块级区域。IFC(Inline Formatting Context)同样管理inline元素排布规则的就是IFC。那么,他们是从何而来呢?CSS2.1+中规定一下方式可以生成BFC:1、根元素;2、float值不为none;3、overflow不为visible;4、display值为flex、inline-block...

2019-07-05 11:21:56 195

原创 jq请求数据时,cookie丢失问题

解决:$.ajax({ url: `${process.env.BASE_API}/offical/rw-recruit/list?pageNum=1&pageSize=2`, type: "GET", xhrFields: { // 详情查看jq官方文档 withCredentials: true }, succe...

2019-06-18 18:02:35 1128

原创 antd-mobile采坑

1、SearchBar 在第一次进入页面或者刷新页面时,样式错乱;当聚焦再离焦之后样式正常。解决办法:.am-search-input{ max-width: 100%;}问题样式图片:

2019-04-08 15:11:07 1279

原创 fetch实现跨域问题

CORScors是"Cross-Origin Resource Sharing"的简称,是实现跨域的一种方式,相对于其他跨域方式,比较灵活,而且不限制发请求使用的method。const Headers = new Headers({ 'Access-Control-Allow-Origin':'*', "Content-Type":'text/plain'})fetch(`h...

2019-04-03 16:28:07 13593 5

原创 钉钉微应用---导航栏(页面分享功能)

const isdingding = () => {  //判断是不是钉钉  var ua = navigator.userAgent.toLowerCase();  return ua.indexOf("dingtalk") >= 0;};if (isdingding()){ // 右侧导航点击 dd.biz.navigation.setRight({ sh...

2019-04-03 11:11:33 4944

原创 图片等比例展示

/** * 图片等比例缩放 * @param boxW 容器宽 * @param boxH 容器高 * @param imgOriW 原始图片宽 * @param imgOriH 原始图片高 * @return {w: width,h: height} */const imgScale = (boxW, boxH ,imgOriW, imgOriH) => { ...

2019-03-27 17:37:49 614

原创 react合成事件和DOM原生事件的区别

https://juejin.im/post/59db6e7af265da431f4a02ef

2019-02-15 17:06:57 5477

原创 context使用(组件通信方式之一)

context 通过组件树进行数据传递的方式。优点:跨级组件不需要一级一级的传递props,比如孙组件可以直接访问到祖组件的数据。缺点:旧版使用方式// 一、父级组件import React, { Component } from 'react';import PropTypes from 'prop-types';import RouterCom from './router';...

2019-01-20 17:22:58 1274

原创 函数节流

按钮的重复点击、keyup事件、页面的resize、元素的拖拽等都有可能在极短的时间内,频繁调用处理函数。这样高频率的调用可能会使程序卡慢,更甚可能导致浏览器直接崩溃。因此,函数节流是一种解决办法。函数节流原理函数节流原理很简单,就是通过定时器来控制事件处理函数的调用。第一次事件响应之后,添加延迟定时器,等时间结束之后再次响应处理程序,并清理掉定时器。在第一次事件响应和第二次事件响应间...

2019-01-15 17:26:51 914

原创 回调地狱

异步回调地狱,通常的表现为:JS函数从上至下的层层嵌套,前面函数是后面函数的所需参数。$.ajax({ type:'post', url:'/index/jquerydata', dataType:'json', success:(res)=&amp;amp;gt;{ if (res.success) { ...

2018-12-10 16:19:39 603

原创 DOM自定义事件简用

自定义事件,就是有别于浏览器、系统特定的行为事件(类似于click、mouseover、touchstart、keydown等),事件名称可以随意定义,可以通过特定的方法进行添加,触发以及删除。const handler = (event) =&gt; { console.log(event);}// 1、注册事件对象,传递事件数据const timeOutEvent = new Cu...

2018-12-10 15:38:13 445

原创 回调函数

定义通过函数指针调用的函数。若函数(或者改函数的指针)作为参数传递给另一个函数,且改函数被调用了,那么这个函数就是回调函数。异步操作之后常执行回调函数,比如文件的下载、数据的读取等相关操作。与不同函数的不同a、不同函数被调用之后会立即执行;b、回调函数必须等到程序执行完成之后才会调用。var url= 'http://jiekou';var xhr = new XMLHttpRequ...

2018-12-08 16:18:00 227

原创 内存泄漏

是什么一块内存不在被应用程序所使用时,由于某些原因这块内存没有返还给操作系统或者空闲内存池的现象。会导致什么运行缓慢,崩溃,高延迟,甚至一些与其他应用相关的问题。常见的内存泄漏1、意外的全局变量// 在函数作用域中使用未声明的变量,该变量就是全局变量。function foo(arg) { // 变量bar相当于window.bar bar = &quot;this is a hidden...

2018-11-30 14:22:13 160

原创 复杂判断简单化

条件判断还在使用if-else或者switch?是时候换换口味了。一、一元判断A、if-elseif (status == 'signIn') { sendLog('processing'); loadScene('hall');} else if (status == 'init') { sendLog('processing'); loadScene('hall');} el...

2018-11-29 10:56:56 261

原创 new 绑定

在JS中常用new关键字来调用构造函数,创建对象。那么new之后执行了哪些操作:var obj = new Fn();1、var obj = {};在堆空间中开辟一块区域,存放空对象、空数组等;2、obj.proto = Fn.prototype;将空对象的原型指向new对象的构造函数;(设置原型链)3、Fn.call(obj);让Fn的this指向obj,并执行Fn的函数体。温馨...

2018-11-28 18:05:13 305

原创 016、双向绑定实现

通过 Object.defineProperty 实现。自定义双向绑定:&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Document&lt;/title&gt;&lt;/head&gt;&a

2018-11-14 15:55:57 290

原创 017-使用PropTypes进行类型校验

PropTypes 是React内置类型检查功能,可以检查组件的属性等。PropTypes包含了一套验证器,以确保接收的数据是正确的有效的。若接收的值是无效的就会在控制台打印出警告(只在开发模式下进行检查)。温馨提示:v15.5+用prop-types代替了PropTypes。import React,{Component} from 'react';import PropTypes f...

2018-10-30 11:41:45 325

原创 url、href、src

一、url(uniform resource locator)统一资源定位器即网页地址1、格式:协议类型:[// 服务器地址[:端口号]][资源层级文件路径]文件名?查询2、语法:scheme://host.domain:port/path/filenamea、scheme:网络协议类型;http、https、ftp(文件传输协议)、fileb、host:定义域主机(http的默认主机...

2018-10-29 17:40:09 228

原创 010-JSX表达式

React中的JSX在react中使用JSX来代替常规的JS,像XML的JS语法拓展。使用JSX// 1、JS表达式// a1、标签属性render () { var flag = true; return ( &amp;amp;amp;lt;input type='button' value='默认按钮' disabled={flag} /&amp;amp;amp;gt; )}// a2、innerHTML&amp;amp;amp;lt;p...

2018-10-16 00:04:26 320

原创 011-state属性

是什么是 一个UI数据模型,是组件渲染时的数据依据;是页面组件的支撑属性。工作原理state属性对组件进行更新之后,会自动将状态反应到虚拟DOM上,最后将信息更新到DOM上。如何使用import React,{Component} from 'react';class StateComponent extends Component { constructor ( ) { /*...

2018-10-15 22:43:51 232

原创 004-react-devtools安装和使用

在运行react项目时,安装react-devtools使调试更方便。1、下载.crx文件;2、打开拓展程序点击上图所指图标,找到菜单中的‘更多工具’—‘拓展程序’;页面如下:3、将.crx文件拖拽到拓展程序所在页面,显示如图信息即为添加成功;4、运行react项目之后,打开控制台,若出现如下情况则为正常,若没有显示“React”属性,则进行拓展程序中查看插件相应权限是否开启。...

2018-10-12 17:27:36 3331 1

翻译 多分辨率、自适应控件

一、Widget实现多分辨率自适应排版基础。在运行时每帧都按照设置的对齐策略进行对齐,组件所在节点的位置(position)和尺寸(width,height)属性可能会被限制,不能通过 API 或动画系统自由修改。top、right、bottom、left值可以像素也可以是百分比。参考:http://docs.cocos.com/creator/manual/zh/components/w...

2018-09-19 18:42:30 248

原创 判断运行平台(终端)的操作系统

1、js获取系统var u = navigator.userAgent;var isAndroid = u.indexOf('Android') &gt; -1 || u.indexOf('Adr') &gt; -1; //android终端var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端2、js获取浏览器内...

2018-08-22 11:02:30 2766

原创 时间转换

1、时间戳转为xxxx-xx-xx xx-xx-xx格式function timestampToTime(timestamp) { var date = new Date(timestamp);//时间戳为10位需*1000,时间戳为13位的话不需乘1000 Y = date.getFullYear() + '-'; M = (date.getMonth()+1 &amp;lt...

2018-08-16 11:51:40 194

原创 cocos 原生打包报错问题

1、项目配置问题* What went wrong:A problem occurred configuring project ':implementation'.&amp;amp;gt; ABIs [armeabi] are not supported for platform. Supported ABIs are [armeabi-v7a, arm64-v8a, x86, x86_64]....

2018-08-07 19:36:59 848

原创 坐标转换

cocos-crator节点的坐标都是相对于父节点而言的,即以父节点为参照物。 若需要获取节点在场景中的坐标,在不改变层级关系的前提下需要借助convertToNodeSpaceAR方法来进行转换。// 需要转换坐标的节点let node = cc.find("Canvas/tab/sub_tab");/* cc.v2(x,y)创建cc.Vec2对象(即2D向量和坐标)例...

2018-07-04 17:14:07 531

原创 全局变量的使用

若需要使用全局变量时,那么就尝试再window对象下进行定义。若该变量值可能在cocos中用到,那么可以在window.cc对象下添加属性和方法。 在命名变量名称时,需要注意: 1.使用前初始化并赋值; 2.命名时防止和已存在的变量名冲突; 3.若未定义可能会抛出异常。onLoad: function () { // 定...

2018-07-03 18:07:53 295

原创 截图

分享功能在游戏中是很常见的一种功能模块,分享进行时添加游戏图片会更加形象,增加游戏的吸引力。那么,今天我们就来聊聊cocos的截图功能。思路:创建一个虚假截图对象;创建一个新的精灵图节点,用来接收截到的图像资源;反转图像(截到的图片时倒转的);保存精灵图片到本地。(上传或者传递到android端)代码// 1、 //1.1、虚假截图对象的大小 ...

2018-07-02 20:55:35 358

原创 cocos creator---动画制作

温馨提示:标准动画为24帧/秒;(即每秒播放画面24张) 1、创建节点(该节点必须有Sprite组件) 2、在1中创建的节点上添加动画组件,并创建动画保存动画 3、开始编辑动画 4、添加动画属性(添加图片) 5、播放动画let anim = cc.find('Canvas/test');// 步骤1中创建的节点anim = anim.getComponent(c...

2018-06-14 14:39:54 5260

原创 cocos creator---颜色的设置和更改

var colorCode = cc.color(255,255,255,255);/*cc.color参数分别代表颜色值:red、green、blue、alpha*/生成的颜色值如下:

2018-05-11 14:51:54 30219

原创 cocos 打包报错问题

1、 请到编好设置中去设置,如下图

2018-04-26 16:27:05 1052

原创 ES6---Promise简析和请求封装

1、Promise的特点&nbsp;&nbsp;&nbsp;&nbsp;a、Promise是异步编程的一种解决方案。 &nbsp;&nbsp;&nbsp;&nbsp;b、Promise的状态不受外部影响,一旦建立就会立即执行,无法中途取消; &nbsp;&nbsp;&nbsp;&nbsp;c、一旦状态发生改变之后就不会改变。2、Promise状态&nbsp;&nbsp;&n

2018-04-25 18:34:16 7185 1

原创 002、element-ui报错集合

1、表单组件

2018-04-25 10:55:51 484

原创 001、element-ui前言

前言element-ui是饿了么团队开发的一款功能强大前端UI框架。1、不仅有基于vue框架的版本,还有基于react和angular的ele-ui版本;2、当认为只有中国程序员才会用element-ui,那么你就打错特错了。目前,element-ui已经推出了中文在内的3种语言开发文档;3、内置语言包含了中文、英文、德文、法文、西班牙文等主要语言在内的40多种语言。可以根据不...

2018-04-20 18:51:47 955

原创 015、计算属性(computed)

一、计算属性设计的初衷是为了进行简单的运算,以此来减少模板中逻辑的维护。当模板中用到了运算逻辑,建议使用运算属性(computed来代替methods中的方法)。2、基本写法HTML:&amp;lt;div&amp;gt;{{this.num1}} + {{this.num2}} = {{endNum}}&amp;lt;/div&amp;gt;JS:data () { return { ...

2018-04-20 15:09:24 296

大转盘(活动、抽奖)

大转盘功能: 1、转盘turntable制作; 2、转盘旋转动画等。

2018-09-20

微信小程序---城市选择

微信小程序城市选择控件(城市3级联动)。 1、样式:可以从底部、上部等多个方向弹出; 2、用途:商城收货地址等; 3、附带收货中心

2018-03-13

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除