- 博客(51)
- 收藏
- 关注
RSS订阅原创 dom-to-image使用遇见的问题
在TypeScript中扮演着非常重要的角色，它们主要用于为JavaScript库或没有直接包含类型信息的代码提供类型声明。原因：项目使用ts，找不到dom-to-image的ts声明文件。需要将dom元素，生成一个图片，选择了dom-to-image。创建了一个typings.d.ts，并在里边进行一个声明。这里需要从隐藏原始的dom（即 #mian）项目技术栈：vue + ts。
2024-10-25 18:35:41
268
原创 el-table多选分页回显
仅对 type=selection 的列有效，类型为 Boolean，为 true 则会在数据更新之后保留之前选中的数据（需指定。**实现：**在获取当前页面数据的时候，与selectedList中的数据对比，如果有已选项，就勾选。**场景：**在第一页中选择了一项，切换到第二页全选，再切换为第一页，要勾选第一页的已选项。**注意：**因为做了分页，对于全选和取消全选，都是本页数据的全选，
2024-06-20 13:54:40
759
原创 The requested module ‘./reactive.js’ does not provide an export named ‘reactive’
修改导出的变量名，或者修改文件名。在html中使用ESModule。导出的变量名不能与文件名一样。
2024-02-28 10:21:02
596
原创 闭包的定义与作用（含举例）
闭包 是指在一个函数内部定义的函数可以访问该函数作用域内的变量，及时在外部函数执行完毕后，内部函数仍然可以访问到这些变量。换句话说，闭包使得函数可以记住并访问其词法作用域内的变量，即使在其定义的词法作用域之外执行。（函数在定义时，他所能访问的变量都已经确定了）
2024-02-19 17:19:26
675
原创 web worker的介绍和使用（包含使用案例）
Web Workers 是在浏览器中运行 JavaScript 代码的一种机制，它们在主线程之外运行，可以在后台执行一些任务而不阻塞用户界面。Web Workers 使得在浏览器中执行多线程操作成为可能，这有助于提高性能和响应性。在传统的浏览器中，JavaScript 是在主线程中运行的，而主线程主要负责处理用户界面和与用户交互的任务。使用 Web Workers 可以创建额外的线程，这些线程在后台运行，独立于主线程。每个 Web Worker 都有自己独立的全局上下文，与主线程中的全局上下文是分离的。
2023-12-28 15:41:56
838
原创 前端安全（xss与crsf及其案例）
CSRF攻击是一种通过欺骗用户在受信任的网站上执行非自愿的操作的攻击。攻击者在用户受信任的网站上伪造请求，当用户已经在该网站登录的情况下，这些伪造的请求可能会以用户身份进行执行。XSS攻击是一种注入恶意脚本（通常是JavaScript代码）到用户浏览器中的攻击方式。攻击者通过在受信任网站上注入恶意脚本，使用户在浏览器中执行这些脚本。防范XSS的方法包括对输入进行合理的验证和过滤，使用内容安全策略（CSP）来限制允许执行的脚本源，以及在显示用户输入时进行HTML转义等。
2023-12-28 11:02:21
1493
原创 策略模式（及案例）
假设我们有一个评分系统，根据用户的得分将其分为不同的等级。我们可以使用策略模式来实现这个例子，根据用户得分的不同区间采用不同的评级策略。维持一个对策略对象的引用，负责将客户端的请求委派给具体的策略。上下文通常会包含一个接口，使得客户端可以动态地切换策略。实现策略接口，提供具体的算法实现。每个具体策略类负责处理一种特定的情况或算法。它包含了实际的业务逻辑。算法或操作的通用接口，通常是一个抽象类或接口。该接口声明了策略类所必须实现的方法。
2023-12-28 10:39:21
859
原创 vuepress路径问题，导致图片不显示
参考：https://blog.csdn.net/weixin_57677300/article/details/128017651。图片不显示，报 Uncaught SyntaxError: Unexpected token '<'错误。很可能就是：路径配置原因。需要将它改为 ‘/’
2023-12-07 18:42:50
721
原创 vuepress服务器部署问题
使用了阿里云服务器，准备配置一个VuePress的静态博客到服务器上。通过nginx，监听8080端口。开了端口之后，999端口可以访问，8080端口报了500，于是就发现了第二个问题。服务器是linux，复制的文件经过了window系统，导致出现错误。从宝塔中复制一个文件到另一个文件夹。3.复制文件的问题（不确定），报了500，说明端口不通。2. 两个文件夹的权限不同。然后是报500，但是。最后发现，两个问题；
2023-11-30 10:39:57
184
原创 响应头中存在cookie，浏览器却记录不上
设置cookie vla和set cookie标头的尝试被阻止，因为其Domain属性对于当前主机url无效。
2023-03-07 10:08:11
2881
原创 No match found for location with path
No match found for location with path错误
2022-11-02 14:14:44
1783
原创 this.getOptions is not a function at Object.loader
this.getOptions is not a function at Object.loader
2022-09-02 14:22:04
1664
原创 Error: options/query provided without loader (use loader + options)
Error: options/query provided without loader (use loader + options)报错
2022-09-02 14:08:20
225
原创 H5、CSS3、ES6 新增属性
H5新增属性1.语义化标签header , footer , aside , article , section , nav , figure , figcaption , dialog , hgroup等作用：1.结构清晰2.有利于SEO优化2.新增表单元素datalist: 给input增加选项列表keygen：提供用户验证output：通常和form表单结合，展示计算结果3.新增表单类型input:url , tel , email , number , range , colo
2022-03-28 15:40:37
349
原创 useEffect使用
1.usEffect的组合useEffect(fn，【？】)当只传入一个函数和空数组【】时，只会在componentDidMount中当只传入一个函数时，会在componentDidMount和componentDidUpdate中执行当只传入一个函数和【】时，且函数返回另一个函数；fn会在componentDidMount中执行，返回的函数会在componentWillUnmount中执行。...
2022-03-27 10:53:57
294
原创 js中判断属性在实例上还是在原型上
知识点： in 和 hasOwnProperty 的区别function Person(password){ this.password=password}Person.prototype.username='fxk'let obj=new Person('123455')console.log('password' in obj) //trueconsole.log('username' in obj)
2022-03-24 18:04:10
210
原创 React面试题
1.什么是错误边界错误边界是一种react组件，可以捕获并打印发生在其子组件树任何位置的JavaScript错误，并会渲染出备用UI。作用：防止子组件的错误导致整个组件树被卸载错误边界无法捕获以下场景产生的错误：1.事件处理异步代码（setTimeout或者requsetAnimationFrame）服务端渲染它自身抛出来的错误使用：如果类组件中使用了static getDerivedStateFromError() 或者 componentDidCatch() 这两个生命周期方法中的任
2022-03-24 18:01:46
2052
原创 JS时间循环
JS是单线程的，有一个执行栈，和任务队列。Js的代码有同步任务和异步任务，同步任务直接在执行栈中执行，而异步任务在有了结果之后，会被放到任务队列中，等到执行栈中为空时，会去执行任务队列中的异步任务。异步任务 分为 宏任务和微任务，微任务会被放到微任务队列中，并且每执行完一个宏任务，就要将微任务队列清空（执行完微任务队列中所有微任务）。宏任务：主函数块也是宏任务。requestAnimationFrame：下次页面重绘前所执行的操作，而重绘也是作为宏任务的一个步骤来存在的，且该步骤晚于微任务的执
2022-03-01 20:37:12
692
原创 JS深拷贝
方式一：JSON.parse(JSON.stringtify(obj))缺点：不能克隆对象中的方法方式二：function deepClone(target, map = new Map()) { if (typeof obj === 'object') { //可能为数组 let res = Array.isArray(target) ? [] : {} // 解决循环引用的问题 map.set(target, res) for (const key
2022-02-28 16:11:45
326
原创 new的实现
new做了什么？创建一个对象obj取出原始构造函数修改obj的原型改变obj的this指向根据返回值的类型，判断返回什么function Objfactory() { let obj = {} Constructor = [].shift.call(arguments) // 可以访问构造函数原型 obj.__proto__ = Constructor.prototype var ret = Constructor.apply(obj, arguments)
2022-02-28 15:05:11
116
原创 React知识点
1.什么是jsxjsx是一个JavaScript的语法扩展。2.jsx表示对象Bable会把JSX转译成一个名为 React.createElement() 函数调用。const element = ( <h1 className="greeting"> Hello, world! </h1>);const element = React.createElement( 'h1', {className: 'greeting'}, 'Hel
2022-02-24 15:13:11
716
原创 ES6 模块与 CommonJS 模块的差异
1.CommonJS是值的浅拷贝，ES6是值的引用。2.CommonJS是运行时加载，ES6是编译时加载运行时加载: CommonJS 模块就是对象；即在输入时是先加载整个模块，生成一个对象，然后再从这个对象上面读取方法，这种加载称为“运行时加载”。编译时加载: ES6 模块不是对象，而是通过 export 命令显式指定输出的代码，import时采用静态命令的形式。即在import时可以指定加载某个输出值，而不是加载整个模块，这种加载称为“编译时加载”。CommonJS 加载的是一个对象（即modu
2022-02-21 10:00:12
575
原创 rem与em
1.rem：相对与根元素font-size的大小，若未设置，则相对于默认font-size 一般是16px2.em：相对与父级元素font-size的大小，如果外层父级未设置font-size，再从外层查找，如果所有父级都为设置，就是相对于默认font-size的大小。Rem例子： html{ font-size: 20px; } .box{ font-size: 2rem; heigh
2022-02-15 14:14:53
433
原创 手写系列___封装Ajax
function myAjax(method, init) { var xhr = null if (window.XMLHttpRequest) { xhr = new XMLHttpRequest() } else { //兼容ie6等 xhr = new ActiveXObject() } // open中有三个参数，分别是 method，url，async ，方法，请求的url，是否为异步请求 xhr.open(met
2021-12-29 16:34:19
252
原创 手写系列1___Promise
const Pending = 'pending'const Fulfilled = 'fulfilled'const Rejected = 'reject'class MyPromise { constructor(fn) { // 立即执行函数 fn(this.resolve, this.reject) } value = null error = null // 初始状态 state = Pending
2021-12-29 15:20:22
398
原创 问题（1）
需求：将某一个dom元素中的内容转为pdf，打印出来的pdf之后还需要加一个标题。大致方向：使用html2canvas获取dom元素在canvas绘制之后的数据，再使用jspdf将获取的数据打印为pdf。遇到的问题：怎么将标题加进去。方案一：在打印之前，将 标题元素 就加进去，设置 display：none，在打印的时候将display：block，打印完之后，再设为 display：none问题： 标题元素会在页面上，闪现一下方案二：获取该dom元素之后，自行创建一个标题，通过app
2021-12-27 13:57:41
107
原创 前端面试题
面试题1.闭包篇1.1作用域作用域就是一套规则，用于确定在何处以及如何找变量标识符的规则。（就是查找变量的地方）1.2 作用域链函数之间的嵌套形成了作用域链。1.3 词法作用域词法作用域 是 作用域的一种工作模式。在你写代码时将变量和块作用域写在哪里来决定，也就是词法作用域是静态的作用域，在你写代码时就确定了。1.4 闭包的概念当函数可以记住并访问它的词法作用域时，就产生了闭包，即使函数是在当前词法作用域之外执行。1.5 闭包可能造成的问题：（1）内存泄漏 解决：使用de
2021-12-14 22:15:53
4776
原创 回流与重绘
解析页面的过程：将Html元素解析为DOM树将css解析为CSSOM将dom树与cssom结合生成Render Tree根据Render Tree计算元素在屏幕上的位置与大小，并将它们渲染出来。注：由于浏览器使用的是 流式布局，一般只需要遍历Render Tree一次就可以。但table及其内部元素除外，通常要花三倍同等元素所花的时间。回流（重排）：Render Tree中部分DOM或者全部DOM的尺寸、结构、某些元素发生改变时，重新渲染部分或者全部文档的过程叫做回流。首次渲染改变浏览
2021-12-14 10:00:18
596
原创 canvas与svg的区别
canvas：更适合绘制元素数量较多的图表，（如热力图、地理坐标系或平行坐标系上的大规模线图或散点图等）svg：占用的内存小，是矢量图，缩放之后不会失真，不模糊。
2021-12-13 12:05:35
479
原创 Redux（类比解释，容易理解）
Redux1.1 redux的设计思想（1）Web 应用是一个状态机，视图与状态是一一对应的。（2）所有的状态，保存在一个对象里面。#1.2 类比解释React组件 -----------------客人ActionCreators------------服务员Store-------------------------老板Reducers-------------------后厨action------------------------菜单场景描述（建议先读文字）：客人进店，服务员
2021-12-13 09:45:24
424
原创 随写。。。
行高是指文本行基线间的垂直距离。1.当不给div设置高度的时候，div的高度取决于line-height，而不取决于font-size2.line-heigh 与 height 的关系有三种，相等大于小于http 与 https的区别http：超文本传输协议，是一种基于请求与响应，无状态的，应用层的协议，常基于Tcp/IP 协议传输数据。http/0.9 不涉及数据包传输，规定客户端和服务器之间的通信格式，只能GET请求。http/1.0 传输内容格式不限制，增加PUT、PATCH、
2021-11-28 20:56:17
1223
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人