- 博客(24)
- 收藏
- 关注
RSS订阅原创 如何快速切换镜像 nrm
如何快速切换镜像如何快速切换镜像1. 安装 nrm2. 使用如何快速切换镜像我们 install 的时候可能会因为npm镜像太慢导致Install 失败。一般我们都是使用淘宝镜像npm config set registry https://registry.npm.taobao.org npm 发包的时候我们又会 切换回来 npm镜像npm config set registry https://registry.npmjs.org 有没有一个快速切换的方法呢？nrm 是一
2022-05-17 17:19:56
155
原创 npm 如何发布一个 私域 @xxx/xxx 包
npm 如何发布一个 私域 @xxx/xxx 包npm 如何发布一个 私域 @xxx/xxx 包1. 创建一个文件夹2. npm init -y3. 修改 package.json4. 登录5. 发布npm 如何发布一个 私域 @xxx/xxx 包1. 创建一个文件夹2. npm init -y3. 修改 package.json{ "name": "@songzhanpeng/demo", // @xxx你当前账号的名称 "version": "0.0.2", "descriptio
2022-05-17 16:27:05
779
原创 scratch-gui扩展自动导入
文章目录前言一、scratch-gui扩展是什么？二、使用步骤1.上代码2.效果总结前言例如：scratch-gui可以选择扩展， 只需要拿出来部分功能就可以做自动导入扩展。提示：以下是本篇文章正文内容，下面案例可供参考一、scratch-gui扩展是什么？示例：scratch-gui扩展，就是素材库，添加更多的素材去组合你的作品。二、使用步骤1.上代码代码如下（示例）：// 省略资源引入部分，无更改引入import ...class Blocks extends React
2022-04-07 16:37:17
1380
1
原创 scratch-gui 项目启动全过程
scratch-gui 项目启动全过程1. 下载项目2. 项目安装3. 项目启动成功1. 下载项目第一种 git clonegit clone https://github.com/LLK/scratch-gui.git第二种 打开 https://github.com/LLK/scratch-gui直接通过 Download ZIP 下载2. 项目安装tips: npm 镜像用npm镜像不要用淘宝镜像，有些安装包淘宝安装不上。cd scratch-guinpm insta
2022-04-01 16:00:08
762
原创 scratch 快速创建一个自定义blocks
🎨 在理想的最美好世界中，一切都是为最美好的目的而设。 —— 伏尔泰一、项目信息快速入门二、需求相关2.1 效果展示预期展现效果： 实现一个简单的积木2.2 必需的文件路径文件如下 blocks.js src/lib/blocks.js make-toolbox-xml.js src\lib\make-toolbox-xml.js 2.3 文件代码blocks.js 模板函数定义模板名称 模板事件模板使用 ma...
2022-04-01 15:46:05
786
原创 js之对象转化为字符串形式的数据
对象转化为字符串形式的数据1.需求2.解决方案3.使用4. 小骚话1.需求路由页面跳转带参数，每一次都要拼接大量参数，不是很方便// 路由跳转 越来越多的参数显得跳转比较冗余this.$router.push('/pages/setting/index?a='+1+'&b=3'+'&name=宋子羡')2.解决方案利用函数转化参数function isObject(data) { // 对象 const reslut = Object.prototype.toS
2022-01-17 15:42:50
425
原创 vue之mixins使用
vue之mixins使用1.简介1.1 官方简介1.2个人理解2. 使用2.1 验证是否成功2.2 局部使用1.简介1.1 官方简介混入 (mixin) 提供了一种非常灵活的方式，来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被“混合”进入该组件本身的选项。1.2个人理解程序的本质就是辅助人来做事情，能有代码实现的，坚决不手动实现，例如，假如每个页面都用到的一个方法，每个页面都复制一份使用，极大的浪费时间精力，mixins 就
2022-01-11 17:16:40
316
原创 vuex 手动封装一个日志快照插件
文章目录前言一、vuex 插件是什么？二、开发前置1. 先阅读官方手册2. 官方事例三、开发插件1. 明确需求2. 编写2.1 可以查看上一次数据、中间传递数据 和 更改过的数据2.2 利用 console.groupCollapsed 、 console.groupEnd 方法包裹内容2.3 优化总结前言学习手动封装vuex 插件提示：以下是本篇文章正文内容，下面案例可供参考一、vuex 插件是什么？示例：vuex 插件 是基于 vuex开发的，类似于 中间件 观察数据流内容二、开..
2021-12-20 15:53:19
316
原创 前端工程化之vuex自动引入module
文章目录前言一、前端工程化是什么?二、使用工程化之前1.引入module2.webpack 之 require.context总结利用好自动化，可以提高项目的效率，减少重复性高的工作前言提示：vue之vuex自动引入module：例如：节省时间成本提示：以下是本篇文章正文内容，下面案例可供参考一、前端工程化是什么?一切能提升前端开发效率，提高前端应用质量的手段和工具都是前端工程化。二、使用工程化之前1.引入module代码如下（示例）：import Vue from 'vue'im
2021-12-20 10:54:20
567
原创 vue之 vuex 日志监听 createLogger
vuex 内置日志查看函数 createLogger1.使用import Vue from 'vue'import Vuex, { createLogger } from 'vuex'Vue.use(Vuex)const debug = process.env.NODE_ENV === 'development' // 开发环境export default new Vuex.Store({ state: { name: "songzixian", age: 18
2021-12-17 17:33:59
1191
原创 antd 分析 Button ts篇
分析 antd – Button – Ts尝试反向推导 button 组件 源码如下样式文件使用 antd 的 cssimport React, { useEffect, useState, ReactNode } from "react";import { LoadingOutlined } from "@ant-design/icons";import Class from "classnames";interface Props { children?: ReactNode;
2021-11-24 17:48:37
614
原创 element-ui select实现关键词高亮
效果图代码<template> <el-select v-model="value" clearable filterable remote :remote-method="remoteSearch" placeholder="请选择" @clear='handleClear' > <el-option v-for="item in options" :key="item.va
2021-11-18 19:52:48
1553
原创 分析 antd -- Button
分析 antd – Button尝试反向推导 button 组件 源码如下样式文件使用 antd 的 css<link rel="stylesheet" href="https://ant.design/index-f273b100.css">import React, { useEffect, useState } from "react";import { LoadingOutlined } from "@ant-design/icons";import * as Clas
2021-11-18 16:22:27
795
原创 延迟执行函数
封装一个延迟函数使用 setTimeout关于setTimeout使用说明const delay = (fn, ms = 1000, ...args) => setTimeout(fn, ms, ...args);使用 方式一delay( (text) => { console.log(text); }, 1000, 'later'); // 一秒钟后打印 later使用 方式二delay( () => { // 函数内容默认一秒钟后.
2021-11-17 15:23:11
98
原创 平滑滚动到页面顶部
平滑滚动到页面顶部。使用“Document.documentElement”或“Document.body”和“Element.scrollTop”获取与顶部的距离。滚动距离顶部的一小部分。使用’window.requestAnimationFrame()`设置滚动动画。const scrollToTop = () => { const c = document.documentElement.scrollTop || document.body.scrollTop; if (c
2021-11-15 17:38:06
466
原创 scss中写一个处理px转化rpx的函数
简介：因为特殊原因我比较懒，然后就打算写个scss函数帮我自己进行处理rpx，但是一入scss函数，就花费了不少的时间，下面代码展示。scss 代码展示<style lang="scss" scoped>$multiple: 2rpx;// 转换函数 (15) ==> 30rpx (15,30) ==> 30rpx 60rpx// 转换函数 params 可传参数 无上限@function cover($t...) { $i:1; $result:0; @.
2021-10-22 18:24:25
1105
原创 变量名快速定义
定义变量简介效果图快捷键简介起变量名，是我们在写代码时，最痛苦的事情，所以为了解决这个问题，vscode有一款插件 驼峰翻译助手效果图快捷键tips:记得选中 中文名字，再使用快捷键win: "Alt+shift+t" mac": "cmd+shift+t"特别好用，欢迎关注...
2021-10-15 15:09:19
391
2
原创 项目实战之按钮防连点
平凡的目录前言代码实现uni-appreact前言项目中我们会经常遇到一种情况，比如点击按钮的时候发起请求，但是呢这个请求响应的很慢，用户会觉得点击没有反应，会不停的点击，不停的发送http请求，所以寻求一种解决方式，防连点就是一种比较好的解决方式。代码实现代码实现之uni-appuni-app<template> <view class="page"> <h1>实现目标防连点</h1> <!-- 我是一个工具按钮
2021-09-14 22:55:49
315
原创 axios应用之阻止之前的请求的实现
我是一个平凡的目录前言axios 用到的东西1.拦截器2.`cancelToken` 指定用于取消请求的 cancel token3.`js Map` 数据结构具体实现前言写这篇文章的目的是因为在公司项目中遇到的问题，例如当我切换页面时原本的请求还没有下来，导致内存泄漏的问题，当时想着当我切换路由的时候把之前的没有请求下来的接口给阻止掉，寻求解决的方式。axios 用到的东西1.拦截器2.cancelToken 指定用于取消请求的 cancel token3.js Map 数据结构1.拦截
2021-09-14 17:17:56
240
1
原创 javascript Map的使用
javascript Map的使用Map 函数常用 api1.创建Map实例2.set 设置函数3.get 获取函数4.delete 删除指定键值的函数5.clear 清除所有函数结束语Map 函数ES6 提供了 Map 数据结构。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键。也就是说，Object 结构提供了“字符串—值”的对应，Map 结构提供了“值—值”的对应，是一种更完善的 Hash 结构实现。如果你需要“键值对”的数据结构，Map 比 Ob
2021-09-11 01:15:19
167
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人