- 博客(36)
- 收藏
- 关注
原创 svg 可视化可爱表情包
1. 左侧随机生成表情包- 方式1:控制不住我自己(会生成非常的随机,也很抽象)- 方法2:会在下方列表的21项中随机生成2. 右侧自定义生成- 可控制多种配色,头部配色已设置多种合适配色可选哦~- 默认头部,眼睛,嘴巴都包含多个位置色值可调整(开启自定义就会分散点调整哦,默认不开启则是用统一色系- 可调整项有:颜色,大小(尺寸),位置,样式等。
2022-09-28 10:52:47
661
原创 svg 可视化项目
4. 右侧调整想要的头像效果:颜色,类型等。3. 前进后退查看切换的头像。5. 查看当前头像类型数据。功能介绍:随机生成头像。1. 随机生成任意头像。
2022-09-28 10:29:55
260
原创 react 使用swiper 横向无限滚动
安装:注意:@types/swiper - npm已废弃中文官网:Swiper中文网-轮播图幻灯片js插件,H5页面前端开发1. 新的使用方式注意:安装此版本 npm install [email protected],否则会报错找不到 swiper/reactimport{Swiper,SwiperSlide}from'swiper/react';2. 基础代码<Swiper className="mySwiper" autoplay={{ ...
2022-03-02 14:02:34
2825
原创 dayjs 日常使用
转换转换时间戳.unix()dayjs().startOf('day').unix()时间戳格式化.format()dayjs(time * 1000).format('YYYY/MM/DD')基础使用今天(开始- 结束:dayjs().startOf('day') - dayjs().endOf('day') 明天 明天此时:dayjs().add(1, 'day') 明天00点:dayjs().startOf('day').add(1, 'day') 昨天 开始:.
2021-10-27 18:27:05
5699
原创 Egg.js使用
egg.js基于 Koa 开发,性能优异node版本 >= 8.x创建项目使用脚手架- 初始化$ mkdir egg-example && cd egg-example$ npm init egg --type=simple$ npm i- 运行$ npm run dev$ open http://localhost:7001- 手动搭建- 初始化下目录结构$ mkdir egg-demo , cd egg-demo$ npm init$ np
2021-10-09 10:12:09
817
原创 js 事件循环(event loop) & 事件冒泡
事件循环(event loop)### 执行顺序执行顺序:同步任务 -> 异步任务(微任务 -> 宏任务)宏任务(放在callback queue中,由事件触发线程维护: script(整体代码), setTimeout, setInterval, UI 渲染, postMessage, MessageChannel, I/O, setImmediate(Node环境)微任务(放在微任务队列中,由js引擎线程维护: promise......
2021-05-04 20:53:48
536
原创 git基础操作及进阶
1. gitclone ssh地址 :Please make sure you have the correct access rights and the repository exists生成 SSH 公钥 -> 添加在github Setting -> SSH and GPG keysa. 查看 or 获取 ssh cd ~/.ssh -> ls 查看是否存在 id_rsa.pubb. 不存在则需要生成 c. 查看id_rsa.pub内容:cat ~/.s.
2021-05-03 22:56:51
192
原创 taro 使用微信小程序优惠券插件
taro 使用微信小程序优惠券插件官方使用文档:https://pay.weixin.qq.com/wiki/doc/apiv3/open/pay/chapter5_3_4.shtml使用引入插件包src/app.config.ts 添加:{ "plugins": { "sendCoupon": { "version": "1.1.5", "provider": "wxf3f436ba9bd4be7b"
2021-04-06 14:52:03
1324
原创 umi 后台管理demo
umi 后台管理demoumi + react + ts + dva + antd + egg (有待优化)简单的前后端管理demo, 接口提供增删查改,前端也有相应功能github代码:https://github.com/huiBuiling/ql_admin/tree/master- 前端目录- 后端目录- 效果图...
2021-01-16 16:57:01
527
原创 umi + ts + dva中 model的动态使用
umi + ts 配合使用 dva modelimport{connect}from'umi' 生效条件1. model文件需放置在 src/models下2. umi会识别符合条件的models文件开启dva:.umirc.ts中配置export default defineConfig({ ..., dva: { // 配置自己需要的设置即可 immer: true, hmr: true, },});model文件:src/mod...
2020-12-30 17:54:59
3185
2
原创 小程序:uni学习第八弹之使用iconfont
小程序:uni学习第弹之使用iconfont- 方法1 - iconfont -> Font class -> 下载至本地 - 将下载的压缩包中,以下文件复制到 static/fonts/下- iconfont.css- iconfont.eot- iconfont.svg- iconfont.ttf- iconfont.woff- iconfont.woff2 - iconfont.css 调整// 添加路径前缀:~@/static...
2020-07-10 13:53:45
1869
原创 小程序:uni学习第五弹之请求 | 缓存
小程序:uni学习第五弹之请求 | 缓存1. 请求- uni.request(object)- 参数- url- data:请求的参数- header:设置请求的 header,header 中不能设置 Referer- method- timeout:超时时间,单位 ms- dataType- responseType:设置响应的数据类型 - success:data | statusCode | header- fail...
2020-07-10 11:57:30
706
原创 小程序:uni学习第六弹之图片 | 上传下载
小程序:uni学习第六弹图片uni.chooseImage(object):从本地相册选择图片或使用相机拍照demo uni.chooseImage({ count: 3, // 默认9 sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有 sourceType: ['album'], // 从相册选择 success: res => { // console.lo
2020-07-04 18:39:27
381
原创 小程序:uniapp 第四弹(平台区分|生命周期 | 页面通讯 | 路由)
小程序:uni学习第四弹生命周期应用生命周期应用生命周期仅可在App.vue中监听,在其它页面监听无效onlaunch里进行页面跳转,如遇白屏报错,请参考生命周期函数onLaunch 当uni-app 初始化完成时触发(全局只触发一次)onShow 当 uni-app 启动,或从后台进入前台显示onHide 当 uni-app 从前台进入后台onUniNViewMessage 对 nvue 页面发送的数据进行监听,可参考 nvue 向 vue 通讯页面生命
2020-07-04 16:47:09
1186
原创 小程序:uniapp 第三弹(样式,组件,图片)
小程序:uni学习第三弹组件: 地址1.view视图容器类似于传统html中的div,用于包裹各种元素内容属性hover-class:string | 指定按下去的样式类。hover-class=“none” ,没有点击态效果hover-stop-propagation: boolean | 指定是否阻止本节点的祖先节点出现点击态hover-start-time: number | 按住后多久出现点击态,单位毫秒hover-stay-time: number | 手指松开后点击态保
2020-07-04 16:22:18
638
原创 小程序:uniapp 第二弹(配置项)
小程序:uni学习第二弹开发目录 ┌─components uni-app组件目录 │ └─comp-a.vue 可复用的a组件 ├─hybrid 存放本地网页的目录 ├─platforms 存放各平台专用页面的目录 ├─pages 业务页面文件存放的目录 │ ├─index │ │ └─index.vue index页面 │ └─li
2020-07-04 15:55:14
545
原创 小程序:uniapp 第一弹(开发基础必备)
小程序:uni学习第一弹文档地址官方网址:微信小程序:https://mp.weixin.qq.com/cgi-bin/wxuni:https://uniapp.dcloud.io/1. 流程2. 开发工具微信开发者工具:地址选择适合自己的版本即可uni 项目开发工具:HBuilderX:官方IDE下载地址3. 项目搭建创建项目通过 HBuilderX 可视化界面vue-cli命令行4. 为什么要选择uni-app?5. uni特点:一
2020-07-04 14:32:57
746
原创 JavaScript中的作用域链
JavaScript中的作用域链在 JavaScript 中, 作用域为可访问变量,对象,函数的集合。变量的作用域分为:全局作用域和局部作用域由多个执行上下文的变量对象构成的链表就叫做作用域链函数在执行的过程中,先从自己内部找变量,如果找不到,会逐层向上寻找注意:找的是变量的当前状态demo01 var a = 1 // ① function ...
2020-04-04 22:25:31
117
原创 一段css让全站变灰
全国哀悼日,一段css让全站变灰css3的滤镜属性 filter利用 filter: grayscale;调整元素的灰度值body{ filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); -webkit-filter: grayscale(100%); -moz-filter: g...
2020-04-04 21:47:35
177
原创 玩转node版本切换工具nvm
玩转node版本切换工具nvmnvm库https://www.npmjs.com/package/nvm安装curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.29.0/install.sh | bash说明:- 可在同一台机器上安装和切换不同版本的node的工具- 可下载不同版本npm- 可切换...
2020-04-01 21:54:08
443
原创 vue 动态路由
vue 动态路由routes配置routes = [ { path: '/movie', name: 'Movie', component: () => import(/* webpackChunkName: "movie" */ '../views/Movie'), ...
2020-03-26 15:45:34
106
原创 Vue router报错:NavigationDuplicated
Vue router报错:NavigationDuplicated跳转动态路由报错原因vue router ≥ v3.1后 ,回调形式改成promise api了,返回的是promise,如果没有捕获到错误,控制台始终会出现如图的警告。解决在mian.js内添加 import Router from 'vue-router'; Vue.use...
2020-03-26 14:54:03
181
原创 vue 中使用better-scroll
vue 中使用better-scroll1. 安装:yarn add better-scroll -S2. 使用:import BScroll from 'better-scroll';// 请求到数据后this.$nextTick(() => { this.scroll = new BScroll(this.$refs.hot_body, { options })...
2020-03-25 12:38:43
262
原创 Vue :slot 使用
Vue :slot 使用官方描述 在 2.6.0 中,我们为具名插槽和作用域插槽引入了一个新的统一的语法 (即 v-slot 指令)。 它取代了 slot 和 slot-scope 这两个目前已被废弃但未被移除且仍在文档中的 attribute。Slot - 父组件: <navigation-link url="/profile"> <p>...
2020-03-24 14:31:20
954
原创 vue - filter 之全局和局部的使用
vue - filter全局filter main.js: Vue.filter('setWH', (url, arg) => { return url.replace(/w\.h/, arg); }) 使用: <img :src="item.img | setWH('60.84')">组件filt...
2020-03-23 18:00:20
381
原创 vue + ts 使用
vue + ts 使用vue-property-decorator 属性 @Component (from vue-class-component) @Prop @PropSync @Emit @Model @Watch Mixins (the helper function named mixins defined at vue-cl...
2020-03-23 16:03:08
3420
原创 vue-cli3 + ts 环境搭建
vue-cli3 + ts 环境搭建技术栈- typescript- vue-cli 3.x+- yarn- sass- element-ui- vuex配置 1. npm install -g @vue/cli(版本 vue-cli3) # OR yarn global add @vue/cli 2. vue c...
2020-03-23 15:15:48
897
原创 vue 中 使用 axios 实现防抖功能
利用axios中的 cancelToken实现防抖功能<template> <input type="text" v-model="val"><template> <script>import axios from "axios";export default { name: 'hello', data()...
2020-03-23 15:01:07
2127
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人