热心网友!-优快云博客

原创关于加密blob图片下载

上期讲过如何把图片加密，这期讲讲如何把blob给转为图片下载（请合法使用，如有侵权后果自负）

2023-04-19 09:24:33 1054 1

原创解决图片、视频地址加密问题

切记：需要在页面卸载之前（例：vue 中 beforeDestroy）去释放掉所创建的DOMString。释放方法: URL.revokeObjectURL()

2023-04-14 11:24:21 1281

这种方式就是完全由我们前端工程师来实现的啦，通过写nodejs实现服务器操作，结合webpack打包完成自动部署1、首先我们用nodejs来封装一个能操作远程服务器的工具库文件命名为：serverLib.js2、封装一个webpack插件该插件实现webpack打包后将打包目录文件上传到服务器上。文件命名为：uploadFileWebPackPlugin.js至于webpack插件如何编写，语法是什么？下面推荐几篇文章大家参考下。怎样编写一个webpack插件Webpack原理-编写Plu

2022-06-08 10:18:47 1009

原创 Webpack原理-编写Plugin

Webpack 通过 Plugin 机制让其更加灵活，以适应各种应用场景。在 Webpack 运行的生命周期中会广播出许多事件，Plugin 可以监听这些事件，在合适的时机通过 Webpack 提供的 API 改变输出结果。一个最基础的 Plugin 的代码是这样的：在使用这个 Plugin 时，相关配置代码如下：Webpack 启动后，在读取配置的过程中会先执行初始化一个 BasicPlugin 获得其实例。在初始化 compiler 对象后，再调用给插件实例传入 compiler

2022-06-08 10:18:11 787

原创 vue.js h5跳转app

<wx-open-launch-app id="launch-btn" appid="xxxx" extinfo="要传递的数据" v-if="iosApp"> <script type="text/wxtag-template"> <style>.openbtn{ width: 490px; height: 78px; text-align: center; line-height: 78px; background.

2022-04-22 09:46:00 1114 1

原创小程序自定义分析

其实很简单，给对应小程序后台设置参数自定义分析 | 微信开放文档使用方法：默认配置：对应自己页面内的class 以及要传的值在 data -> return 里声明的变量api上报：生成的代码会有时间名称和参数的代码实例：wx.reportAnalytics('testc', { test: '',});保存测试就会收到相对应的事件分析...

2022-01-26 17:36:50 423

原创小程序谷歌统计 Google Analytics

npm install @ouduidui/ga-tracker在跟踪器上设置自定义跟踪服务器tracker.setTrackerServer("https://ga-proxy.example.com") 修改域名example.com的DNS记录，将ga-proxy.example.com指向你自己的服务器IP 自己服务器上的nginx做如下配置 upstream real_ga_servers { server www.google-analytics.c.....

2022-01-26 17:31:34 2952

原创 vue/uniapp 百度统计埋点

进入网站：百度统计——领先的中文网站分析平台注册账户流程就不介绍了..功能是免费统计的进入管理新增网站解锁功能把此段代码写在项目的pubilc/index.html的title标签下面：<script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.....

2022-01-26 14:24:32 5141

原创 vue写移动端告别rem 用这个方法适配各种手机 1:1还原设计稿

这个有去掉弹框域名/适配移动端/禁止微信分享分辨率是375 比如设计稿是375的，量多少px就写多少px就可以了。在vue的main.js里引入文件config.jsimport '../utils/conifg.js'config.js/*config.js*/function resize () { let windowSize = { width: window.screen.width, height: document.documentElement.cl.

2021-06-04 16:28:55 585

原创 vue解决scrollTop移动端失效的问题

//寻找父元素的ref （组件形式）this.$parent.$refs.xxx.scrollTo({ top: height,//滚动高度 behavior: 'smooth' // 平滑滚动})首先下载插件npm install smoothscroll-polyfill --save然后引入并在组件创建的时候调用下这个方法：比如mounted中import smoothscroll from 'smoothscroll-polyfill' mount

2021-06-03 11:02:59 1326

原创解决移动端『该网页由 xxxx 提供』

禁用页面拖拽document.body.addEventListener( 'touchmove', function(evt) { if (!evt._isScroller) { evt.preventDefault() } }, { passive: false })指定某个元素可以拖拽let overscroll function(el) { el.addEventListener('touchstart', function() {

2021-05-26 10:53:56 1066

原创 sass在vue中配置

1.创建variable.scss 文件// 颜色$color-red:red;$color-yellow: yellow;$color-white: white;$color-light-gray: #F5F5F5;2.创建 vue.config.js 添加css: {loaderOptions: {// 给 sass-loader 传递选项sass: {prependData: @import "./src/assets/css/variables.scss";}}},.

2021-03-08 14:16:35 417

原创 Vue 3.0 全家桶

vue: Beta vue-router: Alpha vuex: Alpha vue-class-component: Alphavue-cli: Experimental support via vue-cli-plugin-vue-nexteslint-plugin-vue: Alpha vue-test-utils: Alpha vue-devtools: WIP jsx:WIP 可以看到 Vue 3.0 beta 版本是一个项目系列，包含了我们在开发过程中需要的套件、webpack插件等.

2021-02-02 17:25:22 1199

原创 vue3 常见问题汇总

简介：vue3 beta 已经出来一段时间了，最近刚好有时间，就练了练手，练手过程中遇到的问题，总结如下下面是问题vue3 如何注册全局组件import { createApp } from 'vue'import App from './App.vue'const app = createApp(App)// 注册全局组件import SaveButton from '@/globalComponents/SaveButton'app.component('SaveButton', Sa

2021-02-02 17:15:39 1003

原创 Vue解决内存溢出问题

安装两个npm包： increase-memory-limit 和cross-env在package.json 中加 "fix-memory-limit": "cross-env LIMIT=4096 increase-memory-limit", "adjust-mermory-limit": "cross-env LIMIT='4096' increase-memory-limit"然后在项目中npm run fix-memory-limit如果你运行fix-memory-limit提

2020-10-21 10:46:09 3152

原创 vuex刷新后数据丢失怎么解决

导语：我们在写vue项目的时候，经常要用到vuex作为内存来储存，但是我们存放在vuex中的数据（用户数据，当前页面的数据等等）在刷新后就会丢失，那么如何解决呢？超级简单。1，安装vuex-persistedstatenpm install --save vuex-persistedstate2，修改storeimport createPersistedState from 'vuex-persistedstate' const store = new Vuex.Store({ sta

2020-10-20 15:58:33 553

原创 Webpack你不知道的插件

这篇文章整理了18个Webpack插件，分享给Web开发的小伙伴。Plugin是一个扩展器，它丰富了webpack本身，针对的是loader结束后，webpack打包的整个过程，它并不直接操作文件，而是基于事件机制工作，会监听webpack打包过程中的某些分段，执行广泛的任务。插件的特点是一个独立的模块模块对外暴露一个js函数函数的原型(prototype)上定义了一个注入compiler对象的apply方法apply函数中需要有通过compiler对象挂载的webpack事件钩子，钩子的替换中能

2020-09-07 14:55:03 241

原创 Promise 异步函数顺序问题解决

在项目中写到for循环结束之后再去调用一个函数我用的是vue 记录一下//这里是循环得到一些数据之后再进行函数调用 const _arr=[] const that=this that.imageStrs = '' that.imageidtempArr = [] var arr=[] console.log(this.imgList.length) this.imgList.forEach(item=>{ _arr.push(

2020-07-22 15:20:59 420

原创动态CSS背景

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> *{ margin: 0px; padding: 0px; } body,html{ width: 100%; height: 100%; background: linear-gradient(-90

2020-07-16 17:47:29 630

原创关于获取验证码 vue+element

先看效果图吧~一步一步解析吧。1、样式以及dom （校验我就不写了但是我会给加校验的方式）<el-form-item label="验证码" prop="check"> <el-input type="text" clearable style=" width:...

2020-04-16 13:44:47 2067 2

原创 vue表单校验（身份证/手机号等等）

随便在src下创建一个文件 validator.js/*是否合法IP地址*/export function validateIP(rule, value, callback) { if (value == '' || value == undefined || value == null) { callback(); } else { const reg = /^(\d...

2020-04-16 10:57:12 3419

原创 vue项目统一配置请求头以及校验登录状态

main.jsimport './utils/http'在http.js中import Vue from 'vue'import axios from 'axios'import qs from "qs";axios.defaults.baseURL = 'xxxx'; //接口地址// 校验token 封装header统一带tokenimport Cookies from '...

2020-04-16 10:50:54 1000

原创 uniapp关于分享签名授权问题（已解决IOS和安卓兼容问题）

微信分享官方API我是自己分开写的js文件 share.jsimport wx from 'weixin-js-sdk'export function getShareInfo(fxUrl) { //如果分享的内容会根据情况变化，那么这里可以传入分享标题及url //请求接口获得appId 签名签名时间戳还有签名的随机串 this.$http.request({ u...

2020-04-15 14:29:54 2796

原创 element分页查询

dom<el-row class="backgroundColor"> <el-col :span="24" style="background: rgb(238, 241, 246)"> <el-pagination @size-change="handleSizeChanges" ...

2020-03-27 15:31:21 356

原创 element 时间选择限制

dom上 <el-form-item label="开始时间" prop="startTime"> <el-date-picker placeholder="选择时间" v-model="addForm.startTime" style="width: 100%;" ...

2020-03-27 15:29:01 129

原创 uniapp答题考试框架总结

我是独自开发的微信公众号一个考试系统，用的是uniapp框架,这里我对框架进行了一个接口的封装，我们这里后端把appId 以及uid 相关微信授权的信息都是后端处理的，到我这里我只拿到一个token，后台校验。在这里我做的是验证是，是否为微信打开的，便于开发，我就用到了natapp来测试开发判断是不是微信客户端打开这里是后端给我的授权信息地址，他们会重定向到我的页面把token值扔在地...

2020-03-06 09:15:54 6476 10

原创 vue脚手架项目使用cross-env分环境打包

一般的实现方式//常规的做法let mode="dev"; //可以设置：dev、test、prodlet baseUrl="";if(mode=="dev"){ baseUrl=="接口地址";}else if(mode=="test"){ baseUrl=="测试接口地址";}else { baseUrl=="正是环境接口地址";}export { base...

2020-01-17 16:42:27 2469

原创 vue关于从后台获取的数据显示问题

由于后台给的数据是代码比如（男是M女是F这种）尽量使用过滤器不要获取的时候直接修改里面的数据element可以使用 :formatter或者使用filters 过滤保证用到获取的数据的时候直接可以给后台返回原数据不然会涉及到深拷贝浅拷贝问题会改变里面的数据...

2020-01-09 16:04:15 2575

原创 vue打印功能遇到的问题（3）新页面打印跳转

window.localStorage.setItem("print", JSON.stringify(this.currentValue)); let routeData = this.$router.resolve({ path: `/examAdmissionPrint`, name: "examAdmissionPrint" });...

2019-12-25 14:07:52 1066

原创 vue打印功能遇到的问题（2）canvas不可打印问题

创建一个print.js文件然后直接在main中引入注册使用就好了在自己要用的页面中就直接给需要打印的模块加上ref=“print”,如果里面有自己不想打印的模块，给个class=“no-print”下面这些代码是我已经处理过的打印，可以打印出来canvas 已经处理了。// 打印类属性、方法定义/* eslint-disable */const Print = funct...

2019-12-25 14:05:27 1414 8

原创 vue打印功能遇到的问题（1）分页

mounted() { /** * 总结： * 1. insertBefore 插入的元素必须是 DOM对象； * 2. 插入元素之后，父节点下的children 已经发生改变，需要额外处理 * 3. 插入的个数 * 次数 + 第几个元素 * （次数+1）-1 * 4. addDivNum * count + positionNum * (...

2019-12-25 14:02:11 1181

原创 uni-app全局时间格式化

写一个公用文件就是filters.js 位置自己放在公用文件夹下面/** * filters.js * 对Date的扩展，将 Date 转化为指定格式的String 默认是2019-11-25 14:00:00 需要格式则后续传值 * 月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符， * 年(y)可以用 1-4 个占位符，毫秒(S)只能用 1...

2019-11-26 10:22:00 3513 1

原创关于moment升级版全局日期格式化

1.在src目录下创建个filters文件夹，在里面创建个filters.js老规矩下载momentnpm install moment在filters.js中写//filters.jsimport Vue from 'vue'import moment from 'moment'/* 全局时间格式化，使用方法如果需要在script中格式化 this.$root...

2019-11-14 10:34:23 397

原创关于moment时间过滤器的使用方法

1.下载npm install moment在main.js里全局引入 import moment from 'moment'// 然后写全局过滤器 Vue.filter('dataFormat', function (time, format) { // 格式化时间，拿到时间 if(time){ return moment(time).format(...

2019-11-13 17:32:43 1206

原创关于vuex刷新页面数据丢失的问题

在讲vuex数据丢失的问题之前呢，先讲怎么写vuex1.需要配置（我这里由于需要的内容可能以后会用到，所以分开来写的）在vue的src目录下创建一个store文件夹里面有store.js、getters和modules文件夹modules文件夹下有app.js和user.js文件store.js在全局main.js里引入import store from './store/store...

2019-11-06 17:09:33 352 1

原创 vue组件化（文本显示，事件传递，以及父子组件传值）

首先创建一个vue文件用来写组件。如下<template> <div> <el-dialog :title="title" :visible.sync="queryDialog" width="800px"> <el-form label-width="80px" :rules="r...

2019-11-02 11:02:06 398

原创 JS日期转换小技巧（日期补零、日期加减）

如果你遇到后台给你的时间是时间戳的时候，虽然有很多封装好的方法供我们使用，但是，还有有些需求用不了这些封装好的方法。所以，我总结了以下方法。我遇到的问题是，一个类似于驾驶证颁发日期。在过期之前要复审，所谓的复审就是过期的日期那天减去三年零一天。这个时候后台已经把过期的时间戳返给我。这个时候就需要我转换一下代码如下const date = new Date(this.getCard...

2019-11-01 16:01:53 1641

原创总结后台不给操作数据的时候前端来操作

我遇到的是需要在每个tab按钮上加一个标识比如这个按钮拿到的是什么数据有多少条后台给了一个total 就是总共多少条，但是这个项目是之前前端写的，用的element框架， tab栏是写死的循环也是循环的死数据项目都快完成了，那就只能顺着他来了。后台接收的是以对象格式传过去然后用qs中的stringify拆分给他查询也是按照这个字段来查询数据，所以我就循环比较每个直接把值给...

2019-10-24 09:39:11 238

原创 uni-app开发之四app支付模块详解

可以说支付部分是app的一个重要内容，一般的app里都会有这个模块，所以下面单拿出一篇文章给大家进行讲解：首先在uni-app中主要有支付宝支付、微信支付、苹果应用内支付这几种（剩余的支付方式不是主流，我也就不讲啦，嘻嘻>-<），接下来我就分开给大家讲一讲这几种支付方式。（一）开发前准备首先如果你想使用者三种支付方式必须要去相应的开放平台注册并申请支付功能（1）支付宝支付能力...

2019-10-23 11:11:39 1150

原创 uni-app开发app之三分享一下实际项目开发中遇到的坑

因为是第一次使用uni-app来开发app，所以在实际项目中还是碰到了很多问题，虽然现在还有部分问题依然存在，但是大部分的坑，经过自己的不懈努力还是基本解决了的。今天先说说几个已经解决的问题吧。（一）区分开发环境和线上环境以前使用vue-cli的时候基本都是已经配置好环境变量的，本人因为有些懒，也没有深入去了解webpack的配置环境变量的机制。只知道在dev和build里面配置好变量就ok了...

2019-10-23 11:07:51 948