- 博客(60)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 vue3.0 + element-plus + 上传图片到七牛云
时间：2021.8.30 ，想在项目中，把上传的图片存储到 七牛云 上，但是发现，七牛云他只给了一个限时 30 天的 cdn，就是在30天后，这个就会取消掉，不知道上传后的图片还有没有在 。需要绑定 备案的域名，就应该可以永久使用了吧，不过我没有 备案的域名，但是还是记录一下 。1. 创建七牛云账号：创建账号后，需要实名后，才能开通一个 30 天，内存为 10G 的域名！1、创建一个对象存储 空间：他会让你起一个空间名称，用来存储你的东西！地区我选择的是 华南的，访问控制选择 公开的。
2021-08-30 11:28:44
3094
原创 wangEditor4 + vue3.0 创建一个基础的 富文本编辑器
文章时间：2021.8.13如果超过太久了，可能文章就会失效了，所以请注意 。项目场景：使用 wangEditor 来弄一个 富文本编辑器，实现文章的 添加 和 编辑。问题描述：在网上搜了，使用那个富文本编辑器好，于是就找到了这个 wangEditor ，我也不知道 轻量不轻量，反正还好用 。样子的这样的，看图：因为是使用 vue3.0 来和他搭配，他的官网只有和 html 页面搭配，所以到网上找文章，看了好多、好多，发现咦，为什么我的配置都报错了，他们不好呢 ？原来是 他们使用
2021-08-13 17:02:52
2188
4
转载 vue3.x + ts + element-plus 的按需导入问题！！！
时间时间是 2021年7月，程序的版本更新很快，可能这篇文章在不久之后就没有作用了呢！问题：在使用 vue3.x 时，想使用 element-ui 来搭建界面，听说不支持，vue3.x 支持的是 element-plus 然后这个是 官网 https://element-plus.gitee.io/#/zh-CN 。然后，在按需导入时，按照官网的步骤，总弄不好，可能是我太笨了，然后才到网上找，重要找到了一篇文章 博客园的 祁腾飞 。使用步骤：1. 下载：admin > npm i
2021-07-28 10:51:45
2659
1
原创 nuxt 的 @nuxtjs/axios 使用
在使用 vue 的 ssr框架 （nuxt）时，我们使用 @nuxtjs/axios 去发生请求，因为在这个方面，有很多错误，想要记录一下，待以后有办法了，就解决掉他 。1. 发送请求1、下载> npm i @nuxtjs/axios2、然后在配置文件中配置nuxt.config.jsmodules: [ '@nuxtjs/aixos']3、使用：不用导入 axios，因为在 配置文件中导入了，所以可以在 nuxt 上下文中得到，我们就可以解构出来 ；在 nuxt
2021-06-28 15:58:20
722
原创 写博客、写博客
刚刚感觉写博客是要记录你遇到的问题，还是就是你遇到的问题，并解决的问题；觉得这样会比较好，以后，我尽量少写一下自己的学习笔记， 多写一些自己遇到的问题、学习的总结 和 解决的问题，因为时间一久，之前解决的问题可能会忘记了，就可以打开博客看看，还有博客是一些人遇到问题，才会来找的，看看有没有人遇到类型的问题，可以找到答案，当然排查一些 大佬 写的博客，因为他们的博客很有学习的价值在 。...
2021-06-16 11:28:21
91
转载 可移动的侧边栏
还是老样子，学习 CodingStartup起码课的 实现可调侧栏 （点击传送门，可以观看 哔哩哔哩up 的视频），就来写文章了，虽然不是什么很好的文章，但我就是要写 ，哈哈哈。今天实现的效果是 可移动的侧栏，鼠标点击拖动，页面重新加载时，可以记录上一次调整的大小，让侧栏保持和上一次调整的大小一致 。以下是修改图：开始吧！关键代码：鼠标点击 mousedown；鼠标移动 mousemove；鼠标松开 mouseup；让页面元素，不能被鼠标选中的样式：user-select:none；
2021-05-14 09:11:29
771
原创 给 Typora 改个背景颜色
因为白色，在多云天气的时候，看上去有的扎眼，所以就想修改一下颜色，但本地的主题，不好看，所以就想简简单单换一个颜色，网上有很多 自定义主题的文章，我懒，只想改背景颜色，不想弄那么多的操作 。换成这种颜色，就是好看，哈哈哈；操作：在 typora 软件中点击文件 – 偏好设置 – 外观 – 打开主题文件夹 ：就可以看到本地一些 css 文件，这些就是修饰主题的 css 文件；因为我记得白天的背景 github 这个的格式不错，就只改他的背景颜色；所以就复制了一份，修改一下名字 green，在
2021-05-13 16:23:57
6335
4
原创 文字的背景划过效果
文章中的效果模仿的是 CodePen 网站中的效果： 传送门 。原理： 给 h1 的前面添加一个 伪元素，设置他的收缩比例为 0，收缩中心在 右下角 （right、 bottom； 在鼠标移上时，设置 收缩中心在 左下角 （left、 bottom ；并设置 伪元素 收缩比较为 1，还原为原来的样子； 这样，鼠标在移上时，伪元素 从左边进入，鼠标移出时，伪元素从 右边移出 。代码：<style> html { font-size:
2021-05-07 15:40:24
101
转载 翻转的卡片
前言：第二篇 CodingStartup起码课 的视频练习，这几天都在看他的视频，然后跟着做出效果来 。HTML+CSS 制作翻牌效果效果图：要点：使用 position 设置 2 个卡片重叠；正为 正面，反为 背面（ transform: roateY(-180deg)，待会旋转时，正 旋转 180，变为 背面， 反 旋转 0，回到 正面；设置 正 在上面（不是使用 z-index， 而是使用 backface-visibility: hidden 让处于背面的 div 隐藏 ；
2021-04-28 11:37:00
206
转载 塞雷的 汉堡按钮
引用：在哔哩哔哩有一个 up，他是 CodingStartup起码课，他是讲 粤语的哦；他的视频很多都是实现 页面 的一些功能，其中就包括这个 汉堡按钮，这是一个苹果官方网站的按钮 ：苹果官方传送门 。这个是视频的地址，感兴趣的小伙伴，可以看看哦 使用 HTML+CSS 制作动态 Hamburger Menu ，不知道之前有没有小伙伴 分享了。下面的展示图 ：现在...
2021-04-27 08:37:59
230
原创 Excel 的那些事儿啊
RIGHT 函数功能： 可以对数值 / 字符串 进行截取（是从后面开始截取的）；语法：=RIGHT(截取的数值，截取的个数)使用：例如我们想提前 ID 列中数值的后面的数字；可以使用该函数；1，书写函数 =RGIHT(A3,3)，对 A3 单元格进行截取；2，截取后3个作为新值；3，出括号后，点击回车，光标要出括号哦；...
2021-03-19 22:52:16
111
翻译 使用 marked + highlight + tocify.tsx 完成 Markdown（码克党）笔记的渲染
前几天看技术胖的视频，做了一个笔记的渲染功能，记录一下做法，以后忘记了可以查看 ，可能不是很理解，先记录 。一般，我们的文章页面 或是 后台的管理 页面，平常可能要 渲染文章 和 编写文章时的浏览；我们可以使用 以下几个插件来完成这个任务！marked： 码克党语法的渲染；highlight： 代码高亮；tocify.tsx： 提取标题成大纲；1. 语法的渲染 和 高亮显示1.1 下载模块npm install marked highlight.js1.2 进行配置
2021-03-10 11:49:25
1208
2
翻译 实现 (5).add(3).minus(2) =＞ 6
实现 (5).add(3).minus(2)，输出结果为 6这个其实就是让我们给 Number 添加2个方法 ，分别为 add 和 minus ，然后我们调用这2个方法，和我们的 数值相加减，输出为 6；英语翻译 add 为 加， minus 为 减；那就是为 5 + 3 - 2 = 6 咯！首先要明白一点，就是原型链的查找机制；我们的所有数据的基类都是 Object 对象；你可以输出console.log(new String())然后一直看输出的数据中的 __propo__ 他一直指
2021-01-24 21:21:03
393
原创 穆土 的学习和生活网站
前端学习哔哩哔哩：哔哩哔哩中有很多的 up 主，都有学习的资源，你可以学到等多东西：个人关注的 up 主：pink 老师：（黑马培训的一位老师，他带领了很多人进入了前端的领域），我看他的 html，css，js 的入门商品 。珠峰培训官方：（周萧天老师，他讲的 js 原理 和 基础 非常好，超级推荐的，会让你看 js 代码有不同的角度，当然就我们这些基础的人），适用 js 基础不好的我 ；视频有：40个小时彻底打实JavaScript基础全栈之巅： （vue + node
2021-01-21 17:04:17
325
5
转载 js 中的模块化
模块化概念： 一个模块就是 一个文件，一个脚本 。模块间可以相互加载，使用 import 和 export 关键之来进行 导入 和 导出 。export: 导出 / 暴露 当前模块的 变量 或 函数 。import：导入 另一个模块暴露的 变量 或 函数 。有2中模式：// 1.导入特定的变量 或 函数import { Button } from './xxx.js'// 2.单导入一个文件import './xxx.js'例子：我们在 sayHi.js 文件中
2021-01-21 16:07:20
480
翻译 在客户端输入 url，到显示页面经历了什么？
在客户端输入 url，到显示页面经历了什么？总结：1. 在浏览器地址栏中输入 url 按下回车键；2. 浏览器对 url 进行解析，并查找是否对当前的 url 有缓存 且是否过期； - 强缓存 - 协商缓存3. 不存在缓存，就进行 DNS 解析，拿到对应的 ip 地址； - DNS 存在缓存，可以使用 <link> 标签对 DNS 预获取，对 DNS 进行优化4. 根据 ip地址 和 服务器建立连接（三次握手）； - 第三次握手是为了 通知服务器接收到了对方的数据，并开始数据的
2021-01-13 13:58:05
290
转载 js 的 惰性函数
惰性函数知识点： 函数进阶， 函数重写，预编译，堆栈内存1. 概念： 官方说法：惰性函数 表示 函数执行的分支 只会在函数第一次调用的时候执行，在第一次调用的过程中，该函数会被 覆盖 为 另一个按照书写好的函数，之后，再次调用该函数时，就不再经过之前的分支了，执行的函数， 也不是之前的函数了，而是 经过修改后的函数；总结说：就是在执行函数时，函数他 改变 函数自己；（自己理解）。 哈哈哈，听不懂，那看一下例子吧 。2. 背景： 为了解决浏览器的兼容问题，我们会使用 if 判断.
2021-01-05 15:30:26
927
翻译 又是 闭包？
如何看待闭包？理解方面解释： 函数执行形成一个私有作用域，保护里面的私有变量不受外界的干扰，这种保护机制称为 闭包；口头方面的（面试说这个）： 形成一个不销毁的私有作用域（私有栈内存）就是 闭包；如：functon fn () { return function() {}}var f = fn();以上可以称为 闭包，也可以称为： “柯里化函数”如：闭包 => 惰性函数；var utils = (function () { return {
2021-01-02 19:31:03
131
翻译 记录学习 -- 函数的上级作用域
函数的上级作用域：函数执行，形成一个私有作用域，函数的上级作用域是谁，和他在哪里执行没有关系，和他在哪里创建（定义）的有关系，在哪创建，他的上级作用域就是谁：var a = 12;function fn() { console.log(1)}function sum() { var a = 123; fn()}sum()问，输出的 a 是 12 还是 123呢！答：输出的是 12，因为函数的上级作用域，和他在哪里执行没有关系，fn（） 函数是在 sum（）中执
2020-12-30 14:13:44
208
翻译 记录学习 -- 私有变量 和 作用域链练习
私有变量 和 作用域链的练习：请看题var ary = [12, 23]function fn (ary) { console.log(ary) ary[0] = 100 ary = [100] ary[0] = 0 console.log(ary)}fn(ary)console.log(ary)你看看会输出多少呢？
2020-12-30 14:09:09
137
原创 记录学习 -- 私有作用域中的私有变量
在私有作用域中，变量 只有以下2种情况是 私有变量：在私有作用域中，如函数：在里面 声明的变量 （var，let，function）；形参 也是私有变量；重要重要重要！！！var a = 12, b = 13, c = 14;function fn(a) { console.log(a,b,c) var b = a = c = 20 console.log(a,b,c)}fn(a)console.log(a,b,c)我以为是
2020-12-30 13:57:34
153
原创 记录学习 -- ES6 中不存在变量提升 / 预编译：
ES6 中不存在变量提升：在 ES6 中我们可以使用 let 和 const 来命名变量，他们有一些特性：要记住，ES6 语法，代码在执行之前，会进行记录，然后进行检测，如果有重复的就报错；1，切断了 全局变量 和 window 属性的映射机制；console.log(window.a) // undefinedlet a = 12;console.log(window.a) // undefined2，不存在变量提升；console.log(a) // => 报错，没
2020-12-30 13:50:12
402
2
原创 script 标签的 async 和 defer 属性
提问：我们平时都是把 script 标签放到 body 的底部，这是为什么呢？回答： 因为 html 页面是从上而下进行渲染的，遇到 script 标签的话，会进入，去 下载 相应的资源，直到下载好后就会 执行， html 页面才开始继续向下执行，这样会拖慢 html 页面的渲染速度，还有如果一些脚本文件需要操作 DOM，但此时 html 页面还没有加载好，就会报错了；所以一般我们把 script 放到 body 的底部；（总结：放在底部是要等待 html 加载好后，才进行加载）；提问： 那 ..
2020-12-28 14:47:07
378
翻译 加 var 和 不加 var 的区别：
加 var 和 不加 var 的区别：全局作用域下：在全局作用域下使用 var 声明一个变量，相当于给 window 全局对象设置了一个属性，变量的值就是属性值；// 前面2个为 undefined 是因为变量提升，没有值console.log(a) // => undefinedconsole.log(window.a) // => undefined// 但是在 对象 中访问不存在的 属性，也会输出 undefined，就不清楚某个属性 是否存在于对象中，例如console
2020-12-25 15:26:20
492
原创 未解决问题1：shouldComponentUpdate
项目场景：在 React 中为解决组件的加载问题，可以使用 shouldComponentUpdate 生命周期函数，来判断 父组件 传递过来的 数据，是否和之前有所变化，如果没有变化，就说明了 不用 从新加载 子组件，如果数据不相同，就重新加载 子组件；问题描述：父组件传递数据给子组件：Naruto.js ：// 鸣人组件import React, { Component, Fragment } from 'react'import Lists from './Lists'cl
2020-12-25 14:23:15
377
1
翻译 js 中的继承
js 中的继承1. 原型链继承概念： 让 父类的属性和方法 在 子类实例 的原型链上；方法：让 子类的原型 指向 父类的实例，并且把 父类的实例中的 constructor 指向子类；子类.propotype = new 父类();子类.propotype.constructor = 子类;特性：原型链继承 不像其他编程语言的继承一样（其他编程语言的继承一般是拷贝继承，就是 子类 继承 父类，会把父类的属性和方法都拷贝一份到子类中，供子类的实例使用）；他是把 父类的原型 放到
2020-12-22 20:25:17
141
原创 call， bind，apply 的区别？
call， bind，apply 的区别？call 和 apply 调他们既可以改变函数 this 的指向，传递参数 和 调用函数；他们只有一个区别，就是参数的格式，call 是一个一个数，apply 是一个数组；bind 他呢，也和 call ， apply 一样，只是 不会自动调用函数；call：功能：调用函数，传递参数，改变函数的 this 指向；结构：fn.call(this的指向，传递的参数)使用：function fn (x, y) { console.log(thi
2020-12-20 17:01:02
105
原创 清除浮动
提问：浮动会让元素塌陷。即被浮动元素的父元素不具有高度。例如一个父元素包含了浮动元素，它将塌陷具有零高度。你可以按以下哪种方法处理浮动的影响呢？# 回答：### 1. 添加空标签法：在最后添加一个空标签元素，然后设置这个空标签的清除浮动属性为：清除2侧浮动；<style>.float { width: 500px; background-color: pink;}.one { width: 100px; height: 100px; .
2020-12-20 16:59:14
110
原创 React 学习笔记
1. 脚手架的安装下载：npm install -g create-react-app可能会报错，有可能是因为没有权限，以管理员身份运行，就可以了 。C:\Windows\system32>npm install -g create-react-appD:\TEND\node\create-react-app -> D:\TEND\node\node_modules\create-react-app\index.js+ create-react-app@4.0.1added 67
2020-12-20 14:53:32
430
原创 重复题目 border: none 和 border: 0 的区别
border: none 和 border: 0 的区别边框的样式格式为：border-width: 边框的宽度;border-style: 边框的样式;border-color: 边框的颜色;差异： border: 0; 把 border 设置为 0 ，效果等于 border-width:0， 其他2个属性就采用了 默认值； border: none; 等效于 border-style:none； 当定义边框时，仅设置宽度不可以到达显示效果； 当设置 border：no
2020-12-20 14:52:10
94
原创 npm ： let notifier = require(‘update-notifier‘)({pkg})
升级惹的祸错误：我的电脑是 window 7 的，下午，我看到 node 的版本是 6. 多的，于是就想升级，但不知道怎么升级，于是就去卸载掉，到官网找最新版本的是 14. 版本的，但是，但是 他好像不支持 window 7 了，哈哈哈，于是就去找了 12. 的，安装好后，发现 npm 版本有点低，就去升级npm install npm -g下载了最新的 npm 但是，版本太高，和 node 不搭，运行时，就报错了：C:\Users\Administrator>npm install np
2020-12-15 16:06:59
720
原创 对象的 属性名（键）
对象的 属性名（键）var key1 = new Object(); // {}var key2 = new Object(); // {}var obj = new Object();obj[key1] = 'a';obj[key2] = 'b';console.log(obj[key1]); A. “a”B.“b” C. error D. undefined核心： 由于 对象的属性名只能是 数字，字符串，布尔值， 变量； 如果是对象，那么，会把 对象 转为 字符串，在
2020-12-14 17:43:51
375
原创 let 和 定时器
看题for (let i = 0; i < 3; i++) { setTimeout(() => { console.log(i); }, 2000)}A. 0, 1, 2B. 2, 2, 2C. 0, 0, 0D, 2, 1, 0用循环，在定时器中，输出循环的 i，用 let 不会因为定时器是异步的，就输出 i 为累加后的结果；所以还是选 A 。拓展：for (var i = 0; i < 3; i++) {
2020-12-14 16:48:58
250
原创 用 css 绘制三角形
我们可以用 css 的边框样式，来制作一个 三角形 出来：原理：通过设置一个 宽，高为零的块级元素，设置4条边为不同颜色，想要设置哪边就设置其他边为透明就可以了。顺序： 上，右，下，左 。设置：用 css 边框模拟；元素 宽高 设置为零；4个边都要写，在保留需要的边框颜色，其他的设置为透明的；为兼容 低版本浏览器，加上 font-size:0; line-height: 0;版本一：.xx { width: 0; height: 0; border-lef
2020-12-14 10:40:57
338
原创 http-assert 操作未捕获错误
项目场景：昨天在用 node 搭建后台服务器过程中呢，搭到了验证用户 token 的合法性； 前端登录后，服务器发送 token ，然后存储到前端的 本地存储中，在后续（登录后）前端发起如何请求都要携带 token； 然后服务器 要对前端发送的请求中，获取 token，然后判断 token 的合法性； 问题描述：创建一个 登录拦截中间件，在里面我们进行了3步验证 token 的操作； 验证请求是否携带 token； 验证 token 中是否包含用户 di； 到数据库查找是否有
2020-12-12 16:46:35
883
1
原创 undefined 和 null 的区别
以下情况下值为 undefined：1，声明一个变量，没有赋值；2，访问对象不存在的 属性；3，函数的形参没有传递实参进去，形参为 undefined4，函数没有返回值，输出为 undefinednull 的情况一般是我们设置的，他是一个 对象类型的，使用 typeof 会输出 Object 类型；还有他和 undefined 是相等的，但不全等： null == undefined // true null === undefined // false总结：undefined
2020-12-10 23:08:25
197
1
原创 可以使用 calc 画 1px 的线吗？
网上的 1px 都是使用 缩放，也就是 transform: scale(xx); 来得到 1xp 的线，是将 1px 的线进行缩放.a { width: 100px; height: 1px; background-color: #333;}<div class="a"></div>这条线，在 浏览器上不同的手机型号浏览，都会得到不同的 高度（就是大小），所以 1px 高的 线，可能会变成 2px，3px 等等，都有能。于是人们就想到了用 缩放 对吧.a {
2020-12-09 15:55:50
156
原创 搭建静态的响应式个人官网
这几天看到了一个视频（哔哩哔哩 up： 峰华前端工程师）的一个教程，是做一个响应式的官网，用到了好多的 js 包，虽然说使用别人的包，但是效果是很好看的。项目所用到的库有： anime： 动画库，里面有各种动画实现，链接：http://www.animejs.cc/ 。 glide： 轮播图库， 链接：https://glidejs.com/ 。 isotope： 筛选排版库， 链接：https://isotope.metafizzy.co/ 。 scrollreveal：滚动动画库， 链接：h.
2020-12-03 16:45:49
899
原创 扩展运算符小用法
当我们发起请求后，在获取的数据中，我们想要修改 或 给他添加一个属性，可以使用 扩展运算符 来辅助：如：请求到的数据：// 微信小程序// 发起请求const { orders } = await request({ url: '/my/orders/all', data: type})// 存储到 data 中this.setData({ orders})orders 我们想要在里面添加一个 属性，记录商品的数量，但又不想改变里面的其他值：orders 的数
2020-11-25 16:14:23
178
空空如也
二叉树的 val、left、right 是什么意思呢？
2022-04-02
TA创建的收藏夹 TA关注的收藏夹
TA关注的人