WahFung_-优快云博客

原创 vue-cli3 配置less全局变量

安装依赖包npm i style-resources-loader-D根目录 vue.config.jsconst path = require('path')module.exports = { chainWebpack: config => { const types = ['vue-modules', 'vue', 'normal-mo...

2019-07-16 09:59:41 2109

原创 formData上传音乐文件

此例子使用axios请求audio 为 file 文件对象，可通过 file 类型的 input 标签获取。const uploadMusic = async ({appName,audio})=>{ let formData = new FormData() const token = await getToken() formData.append('audio',...

2019-06-21 18:31:44 1502

原创 JS-封装深拷贝函数

简单实现一个深拷贝的函数实现function deepClone(origin){ var isObject = any => typeof any == 'object' && any != null var isArray = any => Object.prototype.toString.call(any) === '[object ...

2019-06-05 22:38:06 1706

原创微信小程序 - Promise 封装多张图片上传(后续)

问题昨天在使用封装的promise上传图片时，又发现了一个小问题（主要因为业务的需要）如果，传入的数组中有一些已经是网络图片路径时，上传图片就会出现报错，导致整个图片上传都崩了。原因是wx.uploadFile上传只接受临时图片路径。所以，在上传前还要做图片url的判断。改进export const uploadImage = (tempFilePaths)=>{ ...

2019-06-01 11:36:27 1779 3

原创微信小程序 - Promise 封装多张图片上传

前言最近，项目需要新加一个用户发布文章的功能，因为小程序选取的图片都是临时路径，所以需要上传到服务器转为网络图片路径再发布出去。但是小程序上传图片只支持单张图片，在这种情况下图片的上传完成后输出的顺序、判断图片是否全部上传完成等，都是一些需要注意的点。在 Promise 的中有一个Promise.all的方法（简单来说就是当所有的异步请求成功后才会执行），在这个方法的帮助下，这些问题都迎刃...

2019-05-30 21:20:22 3939 1

原创一个 Duang~ 的CSS3动画

深夜无聊去lol官网逛一下，第一个吸引我注意力的并不是有什么活动，而是一个css动画。。。Duang~于是找了下源码，复制下来玩一下，还挺有意思的，佩服大佬！这个动画应用在导航栏的小图标上也是挺有意思的。。。玩一年@keyframes jump{0%{-webkit-transform:translate(0);transform:translate(0)}10%{-web...

2019-05-28 00:10:06 596 2

原创微信小程序 - 手写下拉刷新效果

问题最近在仿写腾讯新闻小程序，在首页中分别有三个板块，它们是在一个页面中通过滑动tab的效果来进行切换。所以我用swiper + scroll-view来模仿这样的效果，但是在后面做下拉刷新的时候，发现有个很严重的问题，由于这三个板块是在一个页面之间进行切换的，所以下拉刷新会导致前面两个板块无法出现原生下拉的效果。（这种情况具体的原因我也不太清楚，如果有大佬知道的可以评论告诉我）然后...

2019-05-13 12:17:26 1357 1

原创微信小程序 - 本地图片临时路径转base64 和远程图片转base64

本地临时图片路径转base64base64({url,type}){ return new Promise((resolve, reject) => { wx.getFileSystemManager().readFile({ filePath: url, //选择图片返回的相对路径 encoding: 'base64...

2019-04-25 16:02:38 13368 2

原创 vue组件间的传值（父子、子父、兄弟、后代、非兄弟）

目录父向子传值子向父传值兄弟传值后代传值非兄弟传值在解决组件通讯方面，比较好用的就是vuex，但是在小型的项目中使用vuex就会有点大材小用的感觉，而且会增加文件体积。以下的都是不用vuex的传值解决方法，本文着重点是后代的传值和非兄弟的传值，一些基本的操作就粗略带过。。。好的，进入正题现在假设 App.vue 下有两个子组件brother.vue 和...

2019-04-10 20:34:09 2495

原创 vue-cli3 使用 Tinymce富文本编辑器

安装Tinymcenpm i tinymce -S安装中文插件点击下载语言包解压后得到一个zh_CN.js文件，将这个文件放到你的vue项目文件夹中(路径随意，我是放在public文件夹里)初始化在这里，我是先封装成组件再调用template：<template> <div> <textarea :id...

2019-03-20 15:10:52 4944 1

原创 vue-cli3解决axios跨域问题

首先，你要有axios。。npm安装完后，在main.js下引入一下import Vue from 'vue';import App from './App.vue';import router from './router';import axios from 'axios'//axios不支持Vue.use 可以添加原型使用Vue.prototype.$axios = ...

2019-03-05 20:07:11 4431

原创 JS多维数组去重（对象键名比较法 + indexof）

昨天在复习的时候看了下数组去重的方法，然后测试了下这些数组去重方法优缺点，其中结合两种去重方法（对象键名比较法、indexof）的优点，自己写了个多维数组的去重。这个方法能够去除基本类型，多维数组，函数，null，undefined的重复项。如果有错误的地方或者有其他更好的方法可以留言告诉我，我是萌新(〃'▽'〃)，大佬勿喷。function unique(array){ var obj ...

2018-11-30 22:04:16 3494

原创纯css锚点跳转过渡效果 - 神奇的scroll-behavior属性

我们在浏览网站时，经常会看到返回顶部和楼层跳转的效果，但是这些大部分都是通过js来实现的。那么不用js也可以实现吗？答案是可以的。 ok，先上代码，下面再进行了解！html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta na

2018-11-18 23:26:20 13433 9

原创 16.JS-作用域与作用域链

[[scope]] : [[scope]]指的就是作用域，其中存储了运行期上下文的集合。javascript函数都是一个对象，对象里有些属性是可以访问的，但是有些属性是不可以的，[[scope]]就是其中一个。作用域链：[[scope]]中所存储的执行期上下文对象的集合，这些集合呈链式链接，这种链式连接叫做作用域链。接下来看一个例子: function a(){ ...

2018-10-07 18:55:53 170

原创 15.JS-预编译

了解预编译之前，我们先来看下AO和GO的概念AO(Actived Object)活动对象：保存函数调用时的变量、函数的集合当函数执行时，会创建一个称为执行期上下文的内部对象(AO)。一个执行期上下文定义了一个函数执行时的环境，函数每次执行时的执行上下文都是独一无二的，函数每次执行时，都会把新生成的执行期上下文，填充到作用域链的最顶端。当函数执行完毕，它所产生的执行上下文被...

2018-10-04 23:30:14 148

原创 14.JS-正则表达式的反向引用

选择字符：| com|cn|edu --- 选择其中一个(含有其中一个就能匹配成功)子表达式：用()包围的就是子表达式 str = "((/d)(/w))" 第一个子表达式：((\d)(\w)) 第二个子表达式：(\d) 第三个子表达式：(\w) ...

2018-10-02 20:53:47 2949

原创 13.JS-支持正则表达式的string对象的方法

search():检测母串中是否含有指定的子串(正则表达式)，如果含有，返回该子串的位置，否则返回-1 语法：字符串.search(RegExp) match():检测母串中是否含有知道的子串(正则表达式)，如果含有，返回该子串的数组，否则返回空字符语法：字符串.match(RegExp)...

2018-10-01 23:06:05 201

原创 12.JS-正则表达式的创建和测试

什么是正则：(模糊匹配) 1.正则表达式是一个由特殊字符(\d)和普通字符(a,b)组成的一个有规律的字符串 2.正则表达式一般用于对其他字符串进行逻辑过滤(验证信息是否合法，替换字符串，分割，搜索) 正则表达式能做什么： 1.检查字符串是否合法验证用户名...

2018-10-01 11:19:08 527

原创 11.JS-事件流-冒泡、捕获

事件流：页面接受事件的顺序 DOM事件流：当事件发生时，事件会在该元素节点和根节点之间的路径进行传播，传播过程中所遇到的节点都会接受该事件冒泡：从最具体元素传播最不具体的元素事件发生的元素节点传播到根节点捕获：从最不具体的元素传播到最具体的元素 ...

2018-09-30 13:22:47 157

原创 10.JS-事件监听的注册与移除

addEventListener() 方法：语法：element.addEventListener(event, function, useCapture); 第一个参数是事件的类型 (如 "click" ). //这里的事件句柄是不带on的第二个参数是事件触发后调用的函数。 ...

2018-09-28 18:22:42 1716

原创 09.JS-事件、事件对象

这篇文章是我自己在学习js过程中做的笔记，如果有错误或者遗漏的请评论告诉我。希望大家一起学习！笔记内容主要有:事件的要素、事件分类、事件对象事件三要素： 1.事件源 -- 发生在哪里 2.事件句柄 -- 发生事件的类型 3.事件处理函数 - ...

2018-09-26 23:48:47 174

原创 08.JS-获取行间、内联、外联样式属性

这篇文章是我自己在学习js过程中做的笔记，如果有错误或者遗漏的请评论告诉我。希望大家一起学习！笔记内容主要有:获取行间、内联、外联样式属性获取行间样式 element.style.属性获取内联外联样式 window.getComputedStyle(element, pseudoElement) getComputedStyle 和 eleme...

2018-09-25 22:55:15 625

原创 07.JS-对节点的增删差改

这篇文章是我自己在学习js过程中做的笔记，如果有错误或者遗漏的请评论告诉我。希望大家一起学习！笔记内容主要有:查询节点、增加节点、替换节点、删除节点查询根节点： document.documentElement 属性：clientHeight -- 整个窗口的高度查询body...

2018-09-24 13:59:25 141

原创 06.JS-获取元素的方式

这篇文章是我自己在学习js过程中做的笔记，如果有错误或者遗漏的请评论告诉我。希望大家一起学习！笔记内容主要有:获取元素的方法Dom操作网页内容主要分为以下几点: 标签标签属性 css行间样式标签内容常用获取元素的方法： ...

2018-09-23 14:05:59 111

原创 05.JS-对象

这篇文章是我自己在学习js过程中做的笔记，如果有错误或者遗漏的请评论告诉我。希望大家一起学习！笔记内容主要有:对象的定义、对象的操作1.对象：一组属性和方法的集合定义对象：使用new字符实例化对象 ...

2018-09-22 17:11:01 119

原创 04.JS-数组

这篇文章是我自己在学习js过程中做的笔记，如果有错误或者遗漏的请评论告诉我。希望大家一起学习！笔记内容主要有:数组的定义、数组元素的操作、二位数组的遍历1.数组：一组数据有序排列的一个集合数组的索引值从0开始数组长度 --- 数组名.length ...

2018-09-22 15:01:20 239

原创 03.JS-函数

这篇文章是我自己在学习js过程中做的笔记，如果有错误或者遗漏的请评论告诉我。希望大家一起学习！笔记内容主要有：函数、带形参的函数、带返回值的函数、作用域 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="v

2018-09-21 13:08:53 104

原创 02.JS-流程控制语句

这篇文章是我自己在学习js过程中做的笔记，如果有错误或者遗漏的请评论告诉我。希望大家一起学习！笔记内容主要有：流程控制语句<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title>

2018-09-20 16:59:13 329

原创 01.JS-数据类型、类型转换、运算符

这篇文章是我自己在学习js过程中做的笔记，如果有错误或者遗漏的请评论告诉我。希望大家一起学习！笔记内容主要有：数据类型、输出方式、查看数据类型、类型转换、自动类型转换、运算符、运算符优先级<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></t..

2018-09-20 16:35:04 217

原创 html，css - 苹果开关按钮

通过使用单选框的选中状态（：checked）进行更改样式：checked 和：hover 的概念差不多，但是要搭配上lable标签label 元素不会向用户呈现任何特殊效果。不过，它为鼠标用户改进了可用性。如果您在 label 元素内点击文本，就会触发此控件。就是说，当用户选择该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上。效果：代码如下：<!DOCTYP...

2018-09-08 18:38:20 2299

陈同学的博客