- 博客(74)
- 收藏
- 关注
RSS订阅原创 NavigationDuplicated报错问题
问题：跳转至当前路由时报错：Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location解决：import Vue from 'vue'import Router from 'vue-router'Vue.use(Router)// 解决NavigationDuplicated报错问题const originalPush = Router.prototype.push
2021-05-13 14:08:49
191
原创 fabricjs使用笔记
fabricjs使用笔记安装及引用安装: npm install fabric引用: import { fabric } from 'fabric'声明画布<canvas id="canvas" width="600" height="600"></canvas>// mountedcanvasId = new fabric.Canvas('canvas')绘制图形Line Rect Circle Triangle Path Text Group Ima
2021-03-12 18:23:09
2708
5
原创 antd之Layout和Menu
<template> <a-layout id="components-layout-demo-custom-trigger"> <a-layout-sider style="background: #fff" v-model="collapsed" :trigger="null" collapsible> <div class="logo"> <a-icon type="gitlab" style="fontSi
2021-03-10 10:24:18
995
原创 力扣题集-一维数组的动态和
需求解题const arr = [3, 1, 2, 10, 1]function fn(nums) { for (let i = 0; i < nums.length; i++) { if (i !== 0) nums[i] += nums[i - 1] } return nums }const res = fn(arr)console.log(res) // [3, 4, 6, 16, 17]
2021-01-27 18:45:43
107
原创 力扣题集-转置矩阵
转置矩阵需求解题const arr1 = [[1, 2, 3], [4, 5, 6], [7, 8, 9]]const arr2 = [[1, 2, 3], [4, 5, 6]]function fn(arr) { return arr[0].map((item, i) => arr.map(jtem => jtem[i]))}const res1 = fn(arr1)const res2 = fn(arr2)console.log(res1, res2)结果预览：
2021-01-27 17:29:28
100
原创 for与forEach的区别
元素修改const a = ['a', 'b', 'c', 'd', 'e']const b = ['a', 'b', 'c', 'd', 'e']a.forEach(item => { if (item === 'c') { item.name = 'CC' }})for (let i = 0; i < b.length; i++) { if (b[i] === 'c') { b[i] = 'CC' }}console.log(a, b)终止
2021-01-14 11:18:27
123
原创 简化多重if else(判断时长）
闲来无事看到同事的代码有点冗余，就来改造一下~改造前：改造中： const obj = { 1: '1小时内结束', 18: '2小时内-18小时内结束', 24: '1天内结束', 120: '2天内-5天内结束', 168: '1周内结束', 672: '2周内-4周内结束', 720: '一个月内内结束', 7920: '2个月-11个月内结束', 8760: '一年内' } function formatCompare(
2020-12-15 18:53:23
546
原创 vue-在style中使用data或props中的值
需求：给tips设置动态color方法1 动态style重复代码有一点点多~方法2 setProperty用ref给外层容器标记引用信息 <div class="banner_page" ref="bannerPage">在style中声明变量 .banner_page { --tipsColor: #f08b40; }在mounted给style中的变量赋值（注意：操作DOM的代码要放在mounted后） this.$refs.bannerPage.style.setProp
2020-12-11 17:25:59
4278
原创 Vue实现元素拖拽功能
注册指令directives: { drag: function (el) { let dragBox = el; dragBox.onmousedown = e => { //算出鼠标相对元素的位置 let disX = e.clientX - dragBox.offsetLeft; let disY = e.clientY - dragBox.offsetTop; document.onmouse.
2020-11-27 17:35:42
2288
4
原创 计算数组中重复元素的个数
function countTimes(arr) { return arr.reduce((obj, item) => { // console.log(obj, item, 88) if (item in obj) { obj[item]++; } else { obj[item] = 1; } return obj; }, {}); } var names = ['a', 'b', 'a', 'c', '
2020-11-05 13:38:23
702
原创 在vue项目中预览pdf文件
在vue中预览pdfvue-pdf安装vue-pdfnpm install --save vue-pdf// yarn add vue-pdf使用不分页<template> <div> <pdf v-for="i in numPages" :key="i" :src="pdfUrl" :page="i"> </pdf> </div></template><script>imp
2020-10-29 15:51:35
1896
3
原创 文件下载的几种方法
onDownload (name) { const url = baseUrl() + 'mobileFile/download' const form = document.createElement('form') form.id = 'downloadform' form.style.display = 'none' form.target = '' form.method = 'post' form.acti...
2020-09-25 16:17:28
2512
原创 数组对象之根据特定字段去重
需求： 数组对象去重const arr = [ { id: 1, name: 'aa', age: 16 }, { id: 1, name: 'aa', age: 16 }, { id: 3, name: 'cc', age: 20 }, { id: 3, name: 'cc', age: 20 }, { id: 2, name: 'bb', age: 18 }, { id: 1, name: 'aa', age: 16 },]const newArr = arr.filt.
2020-09-05 09:24:51
1489
原创 Ant Design Vue自定义菜单图标时收起菜单文字不隐藏问题
问题：自定义菜单图标时收起菜单文字不隐藏问题代码：<a-menu-item v-for="item in memberMenu" :key="item.path"> <i :class="['iconfont', item.icon]" style="marginRight: 10px;fontSize:20px;"></i> <span class="">{{ item.title }}</span></a-menu-it
2020-09-01 16:55:31
4198
6
原创 Webpack的基本使用
一项目初始化1. init初始化使用npm init -y完成项目初始化, 会生成 package.json 文件init: 完成项目初始化-y: 使用默认选项2. 安装webpack在命令行中执行npm install webpack webpack-cli -D-D: 安装开发环境依赖, 是–save-dev 的简写二 编写项目入口1. 编写index.html在项目根目录下创建一个 index.html, 作为项目主页文件, 编写如下内容<!DOCTYP
2020-08-13 23:34:43
225
原创 原生js实现filter,map,reduce方法
js原生封装一个filter方法function myFilter(arr, callback) { if (!arr.length || !Array.isArray(arr) || typeof callback !== 'function') { return [] } else { const result = [] for (let i = 0; i < arr.length; i++) { const item = arr[i] i
2020-08-13 22:59:27
461
1
原创 slice与splice的区别
slicesplice不改变原数组改变原数组返回一个子数组返回被替换或删除掉的元素数组arr.slice(2, 3) 从索引为2的元素开始截取到索引为3的元素(包含2,不包含3)arr.splice(2, 3) 从索引为2的元素开始 删除 3个元素(包含2)slice: 从当前数组中截取一个新的数组不影响原来的数组,返回子数组var arr = ['a', 'b', 'c', 'd', 'e', 'f']var arr1 = arr.slice(0, 3...
2020-08-06 22:57:52
121
原创 forEach和map的区别
forEachvar arr = [0, 2, 4, 6, 8];var newArr = arr.forEach(function (item, index, arr) { // console.log(this); // Window{} // console.log(arr); // [0, 2, 4, 6, 8] arr[index] = item / 2;});// 1. 对数据的操作会改变原数组console.log(arr); // [0, 1, 2, 3, 4]
2020-08-06 22:13:43
138
原创 for...of和for...in的区别
for…of和for…in的区别for…in循环的是key。for…of循环的是valuelet arr = ['a', 123, { a: '1', b: '2' }]for (let key in arr) { console.log(`${arr[key]}`); // a 123 [object Object]}for (let value of arr) { console.log(value) // a 123 {a: "1", b: "2"}}推荐使用
2020-08-06 21:31:05
394
原创 Object.defineProperty方法的简单介绍
Object.defineProperty对象定义属性和赋值let Person = {}Person.name = 'cc'person['age'] = 18Object.defineProperty语法Object.defineProperty()的作用就是直接在一个对象上定义一个新属性，或者修改一个已经存在的属性语法: Object.defineProperty(需要定义属性的当前对象, 当前需要定义的属性名, 属性描述符)const user = {}Object.defi
2020-08-05 23:40:37
337
原创 var a=1,b=1与var a=b=1的区别
var a=1,b=1；与var a=b=1;的区别var a=1,b=1；等价于 var a=1；var b=1;var a=b=1; 等价于 var a=1；b=1；var a = 1, b = 1function fn() { console.log(a, b) // undefined 1 var a = b = 2 console.log(a, b) // 2 2}fn()console.log(a, b) // 1 2...
2020-08-01 22:19:30
503
原创 正则表达式的简单使用
正则表达式的简单使用在线测试正则简介正则表达式：用于匹配规律规则的表达式，正则表达式最初是科学家对人类神经系统的工作原理的早期研究，现在在编程语言中有广泛的应用。正则表通常被用来检索、替换那些符合某个模式(规则)的文本。正则表达式是对字符串操作的一种逻辑公式，就是用事先定义好的一些特定字符、及这些特定字符的组合，组成一个“规则字符串”，这个“规则字符串”用来表达对字符串的一种过滤逻辑。正则表达式的作用给定的字符串是否符合正则表达式的过滤逻辑(匹配)可以通过正则表达式，从字符串中获取我
2020-06-01 01:00:39
372
原创 compute与watch和filter
compute与watch和filter1. 计算属性 computed模板中放入太多的逻辑会让模板过重且难以维护 使用计算属性可以让模板更加的简洁计算属性是基于它们的响应式依赖进行缓存的computed比较适合对多个变量或者对象进行处理后返回一个结果值，也就是数多个变量中的某一个值发生了变化则我们监控的这个值也就会发生变化<template> <div&g...
2020-05-06 14:18:18
404
原创 Vue之$nextTick的简单使用
nextTickJavaScript 运行机制详解基本使用<template> <div> <h3>Vue之NextTick</h3> <div ref="num">{{ num }}</div> <div>{{ num1 }}</div> <div&...
2020-04-30 17:04:44
110
原创 Vue之slot的基本使用
Slot一般情况下是酱紫的父组件// index.vue<template> <div> <slot-tmp> Error </slot-tmp> <hr> <slot-tmp> Warn </slot-tmp> </div></template>...
2020-04-30 14:43:14
186
原创 Vue之mixin的基本使用和特性
Mixin1. 基本使用创建mixin文件// mixin.jsexport const HelloMixin = { data () { return { num: 0 } }, methods: { hello () { console.log('hello from mixin') }, addNum () ...
2020-04-30 11:52:55
208
原创 Entrypoint size limit
问题vue-cli打包项目时警告: entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.解决// vue.config.jsmodule.export...
2020-04-27 17:50:21
7263
原创 微信小程序内容安全验证云调用
以msgSecCheck为例1. 新建Node.js云函数2. 在 config.json 中配置 API 的权限{ "permissions": { "openapi": [ "security.msgSecCheck" ] }}3. 接口方法// 云函数入口函数exports.main = async (event, context)...
2020-03-31 13:25:00
635
原创 无法打开“Visual Studio Code”，因为Apple无法检查其是否包含恶意软件
问题:无法打开“Visual Studio Code”，因为Apple无法检查其是否包含恶意软件。解决打开terminal 命令行工具输入命令：sudo spctl --master-disable输入开机密码...
2020-01-05 22:47:22
1076
原创 cocos creator小游戏案例之趣味套牛
趣味套牛0. 思路搭建基本背景奔跑的牛套牛的绳子套牛成功的判定结算重新开始特效,(音效,粒子)1. 基本背景按钮添加 button 组件transition: sprite2. 牛组件cow.js- 设置皮肤数组// cow.jsvar cow_skin_type = cc.Class({ name: 'cow_skin_type', ...
2019-12-20 14:22:01
2887
2
原创 cocos creator小游戏案例之橡皮怪
橡皮怪勇闯地下室主界面1. 触摸事件注册setInputControl: function() { var _this = this // 触摸开始 this.node.on('touchstart', function(e) {}, this) // 移动 this.node.on('touchmove', function(e) {}, thi...
2019-12-20 14:15:05
907
原创 将多个数组按索引排列成对象格式
将多个数组按索引排列成对象格式emmm… 我也不知道这叫个啥需求就是将这样生成这样 function repeat (arr, index, obj, title) { arr.forEach((item, i) => { if (i === index) { obj[title] = item } ...
2019-12-13 19:35:07
228
原创 cocos creator 基础
COCOS 脚本1. 安装API 适配插件开发者 -> VS Code 工作流 -> 安装 VS Code 扩展插件该操作会将 Cocos Creator API 适配插件安装到 VS Code 全局的插件文件夹中这个操作只需要执行一次，如果 API 适配插件更新了，则需要再次运行来更新插件安装成功后在 控制台 会显示绿色的提示：VS Code extension ins...
2019-12-12 17:40:39
250
原创 Ant Design of Vue 定制主题
背景ant design of vue在 vue cli 3中定制主题文件目录文件antd-variable.less/*Write your variables here. All available variables can befound in https://github.com/vueComponent/ant-design-vue/blob/master/comp...
2019-09-12 10:50:52
2486
2
原创 Vue项目小经验
复制template<a-button type="primary" @click="copyUrl(item.response)">Copy URL</a-button>methodscopyUrl (shareLink) { var input = document.createElement('input') input.value = shareL...
2019-08-26 10:07:14
304
原创 小程序富文本图片自适应
从接口里获取到的图片文本:<img alt="" src="http://地址.jpg" height="237" width="550" style="height:auto;" /> 尝试了很多种修改图片样式的方法:this.nodes= htmlString .replace(/<img/gi, '<img width="80%!important" ...
2019-08-15 18:28:44
3060
原创 Vue切换Tab动态渲染组件
使用<component :is="组件名"></component>结合Element-UI的导航菜单 :UI组件el-menu-item里的index写对应的组件名点击事件@select="handleSelect"<el-menu :default-active="activeIndex" class="el-menu-demo" mode="...
2019-08-14 17:01:58
6138
2
原创 MarkDown转Html
全局安装 npm install -g i5ting_toc在需要转的md文件的目录下执行命令 i5ting_toc -f 文件名.md图示html结果
2019-08-13 17:23:53
465
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人