- 博客(52)
- 收藏
- 关注
原创 小程序样式与组件
在进行网页开发的时候,实现轮播图的时候,我们通常先使用 HTML 、CSS 实现轮播图的样式结构,然后使用 JS 控制轮播图的效果,或者直接使用插件实现轮播图的功能,而在小程序中实现小程序功能则相对简单很多。样式时,开发者需要考虑到手机设备的屏幕会有不同的宽度和设备像素比,会采用一些技巧来算像素单位从而实现页面的适配。使用横向滚动时,需要添加 scroll-x 属性,然后通过 css 进行结构绘制,实现页面横向滚动。参数与路径之间使用?小程序运行在手机移动端,宿主环境是微信,因为手机尺寸的不一致,在写。
2024-09-06 15:25:06
547
原创 微信小程序——起步
主体文件页面文件主体文件又称小程序全局文件,顾名思义,全局文件能够作用于整个小程序,影响到小程序的每个页面,且主体文件必须放到项目的根目录下页面文件页面文件,wxss、json 文件能够覆盖主体文件中的样式和配置强烈建议:页面文件夹名称和页面文件名称要保持一致 感叹号。
2024-09-05 15:12:56
710
原创 react项目--博客管理
利用useLocation进行反向高亮//反向高亮//触发个人信息的action//获取store内的个人信息选择时,高亮效果没实现,增加以下两行代码。
2024-06-10 13:54:01
833
1
原创 css基础
什么是 CSS?CSS 指层叠样式表 (Cascading Style Sheets)样式定义如何显示 HTML 元素样式通常存储在样式表中把样式添加到 HTML 4.0 中,是为了解决内容与表现分离的问题外部样式表可以极大提高工作效率外部样式表通常存储在 CSS 文件中多个样式定义可层叠为一个。
2024-06-09 18:37:03
704
原创 HTML、HTML5一览
HTML 是用来描述网页的一种语言。HTML 指的是超文本标记语言: HyperText Markup LanguageHTML 不是一种编程语言,而是一种标记语言标记语言是一套标记标签 (markup tag)HTML 使用标记标签来描述网页HTML 文档包含了HTML 标签及文本内容HTML文档也叫做 web 页面。
2024-06-04 17:00:53
1272
1
原创 webpack
webpack就是一个用于javascript应用程序的静态模块打包工具。从v4版本开始,webpack就可以不用引入配置文件进行打包,但是,它仍然有着高度可配置性。入口起点指示webpack该使用的模块,作为构建内部依赖图的开始。进入起点之后,webpack会找出入口起点依赖的模块和库。默认是 可以指定一个或多个不同的起点。文件名:entry也能接收文件路径数组,这将创建一个所谓的 “multi-main entry”。在你想要一次注入多个依赖文件,并且将它们的依赖关系绘制在一个 “chunk” 中时
2024-05-19 17:57:15
867
原创 Typescript基础
class 类名 {属性名: 类型;constructor(参数: 类型){this.属性名 = 参数;方法名(){....console.log(`大家好,我是${thisconsole . log(` 大家好,我是 ${ this . name } `);} }console . log(` 大家好,我是 ${ this . name } `);} }const p = new Person('孙悟空', 18);
2024-05-10 20:50:28
804
原创 React懒加载
React.lazy 函数能让你像渲染常规组件一样处理动态引入(的组件)。(1) 为什么代码要分割当你的程序越来越大,代码量越来越多。一个页面上堆积了很多功能,也许有些功能很可能都用不到,但是一样下载加载到页面上,所以这里面肯定有优化空间。就如图片懒加载的理论。(2) 实现原理当 Webpack 解析到该语法时,它会自动地开始进行代码分割(Code Splitting),分割成一个文件,当使用到这个文件的时候会这段代码才会被异步加载。(3) 解决方案。
2024-03-17 08:43:36
373
原创 Portal
Portals 提供了一个最好的在父组件包含的DOM结构层级外的DOM节点渲染组件的方法。第一个参数child是可渲染的react子项,比如元素,字符串或者片段等。第二个参数container是一个DOM元素。
2024-03-17 08:43:11
385
原创 styled-components
通过JavaScript来为CSS赋能,我们能达到常规CSS所不好处理的逻辑复杂、函数方法、复用、避免干扰。样式书写将直接依附在JSX上面,HTML、CSS、JS三者再次内聚。它是通过JavaScript改变CSS编写方式的解决方案之一,从根本上解决常规CSS编写的一些弊端。**一定要写className **
2024-03-16 08:50:11
438
原创 Immutable
每次修改一个 Immutable 对象时都会创建一个新的不可变的对象,在新对象上操作并不会影响到原对象的数据。那么,这个属于深拷贝还是浅拷贝。
2024-03-15 08:47:09
421
原创 React路由
路由是根据不同的 url 地址展示不同的内容或页面。一个针对React而设计的路由解决方案、可以友好的帮你解决React components 到URl之间的同步映射关系注:exact 精确匹配 (Redirect 即使使用了exact, 外面还要嵌套Switch 来用)a new entry will not be added to the history stack,这个警告只有在hash 模式会出现。
2024-03-13 23:56:34
712
原创 React hooks
通过自定义 Hook,可以将组件逻辑提取到可重用的函数中,在 Hook 特性之前,React 中有两种流行的方式来共享组件之间的状态逻辑:render props和高阶组件,但此类解决方案会导致组件树的层级冗余等问题。而自定义Hook 的使用可以很好的解决此类问题创建自定义 Hook自定义 Hook 是一个函数,其名称以 “use” 开头,函数内部可以调用其他的 Hook。});}, []);使用return (
2024-03-13 23:56:14
957
1
原创 React生命周期
调用 forceUpdate() 将致使组件调用 render() 方法,此操作会跳过该组件的 shouldComponentUpdate()。通常你应该避免使用 forceUpdate(),尽量在 render() 中使用 this.props 和 this.state。通过这个钩子修改的state,state任何时候都取决于props,其他的函数无法进行修改。在新的生命周期中,废弃了旧版本的3个带will的钩子,新提出了2个钩子。第一次的初始化组件以及后续的更新过程中(包括自身状态更新以及父传子) ,
2024-03-12 15:27:50
1293
原创 浅拷贝,简单深拷贝
如果 target 的类型不是对象或为 null,则直接返回 target,因为不需要进行拷贝。然后,我们根据 target 的类型创建一个空的克隆对象 cloneTarget。在这段代码中,我们定义了 _sampleDeepClone 函数,它接受一个参数 target,表示要进行简单深拷贝的目标对象。在这段代码中,我们定义了 _shallowClone 函数,它接受一个参数 target,表示要进行浅拷贝的目标对象。首先,我们根据 target 的类型创建一个空的副本对象 copy。
2024-03-11 16:20:38
536
原创 手写Object.create(),call函数,bind函数
在这段代码中,我们将原始函数存储在 that 变量中,然后返回一个新的函数。这个新函数在调用时将使用 apply 方法来调用原始函数,将 target 作为 this 值,并将预先传入的参数 args 与实际调用时传入的参数 innerArgs 进行合并。该函数的目的是在给定的对象 obj 上调用当前函数,并传递参数 args。在函数内部,首先将当前函数(即调用 _call 的函数)作为 obj 对象的属性 fn。语法调用 obj 对象的 fn 属性,并将参数 args 传递给该函数。最后,返回调用结果。
2024-03-11 16:19:55
566
原创 全排列,手写reduce
这段代码是一个递归函数 _permute,用于生成字符串参数的所有排列组合。它使用了回溯法的思想。首先,如果字符串的长度为 1,表示已经无法再进行排列,直接返回包含该字符串的数组 [string]。否则,创建一个空数组 res,然后对字符串中的每个字符 s 进行遍历。在每次遍历中,生成一个新的数组 arr,其中排除当前字符s。接着,递归调用 _permute 函数,传入 arr.join(‘’) 作为新的字符串参数,获取其排列组合结果。
2024-03-10 11:04:53
379
原创 事件委托,数组去重
6.如果 obj.hasOwnProperty(typeof item + item) 返回 false,表示 obj 对象不包含当前元素,说明当前元素是新的,那么将其添加到 obj 对象中,并在 filter() 方法中返回 true,表示保留当前元素。5.如果 obj.hasOwnProperty(typeof item + item) 返回 true,表示 obj 对象已经包含了当前元素,说明当前元素是重复的,那么在 filter() 方法中返回 false,表示过滤掉当前元素。
2024-03-10 11:04:34
988
原创 React基础
没有 state 的组件叫无状态组件(stateless component),设置了 state 的叫做有状态组件(stateful component)。props 的主要作用是让使用该组件的父组件可以传入参数来配置该组件。props是正常是外部传入的,组件内部也可以通过一些方式来初始化的设置,属性不能被组件自己更改,但是你可以通过父组件主动重新渲染的方式来传入新的。setState 是异步的,所以想要获取到最新的state,没有办法获取,就有了第二个参数,这是一个可选的回调函数。
2024-03-09 08:51:59
2411
8
原创 ajax,axios,fetch
并不是所有的用户请求都提交给服务器。所以这里就和 Ajax 又很大不同了,一个是思想,一个是真实存在的 API,不过它们都是用来给网络请求服务的,我们一起来看看利用 Fetch 实现网络请求。416——请求中包含Range请求头字段,在当前请求资源范围内没有range指示值,请求也不包含If-Range请求头字段。417——服务器不满足请求Expect头字段指定的期望值,如果是代理服务器,可能是下一级服务器不能满足请求。Fetch 是一个 API,它是真实存在的,它是基于 promise 的。
2023-11-18 21:20:32
1033
原创 413 (Payload Too Large) 2023最新版解决方法
vue2脚手架2.在根目录下创建一个名为 vue.config.js 的文件(如果已存在,请打开该文件)。4.将 http://backend-server-url 替换为你实际的后端服务器地址。这样一个错误,查遍所有csdn,都没有找到解决方法,通过一些方式,终于解决了。博主在用vue脚手架开发的时候,在上传文件的接口中碰到。5.保存 vue.config.js 文件。最后博主成功解决,这个项目用的是。1.打开Vue项目的根目录。6.重新启动开发服务器。
2023-11-03 19:24:48
2574
原创 正则表达式
例如,我们希望从下面的输入字符串 $4.44 和 $10.88 中获得所有以 $ 字符开头的数字,我们将使用以下的正则表达式 (?一般来说 ^ 表示一个字符串的开头,但它用在一个方括号的开头的时候,它表示这个字符集是否定的。例如,表达式[^c]ar 匹配一个后面跟着ar的除了c的任意字符。方法并且匹配成功了,那么这些方法将返回一个数组并且更新相关的正则表达式对象的属性和预定义的正则表达式对象(详见下)。.是元字符中最简单的例子。例如表达式c.+t 匹配以首字母c开头以t结尾,中间跟着至少一个字符的字符串。
2023-10-19 11:39:09
598
5
原创 ECMAScript
of循环进行遍历,唯一的区别是keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历。数组实例的find()方法,用于找出第一个符合条件的数组成员。它的参数是一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回值为true的成员,然后返回该成员。它的参数是一个函数,所有数组成员依次执行该函数,返回结果为true的成员组成一个新数组返回。Array.from() 方法会接收一个类数组对象然后返回一个真正的数组实例,返回的数组可以调用数组的所有方法。
2023-09-16 21:15:26
125
原创 jQuery补充
什么是jQueryjQuery 是一个 JavaScript 函数库。jQuery 是一个轻量级的"写的少,做的多"的 JavaScript 库。HTML 元素选取HTML 元素操作CSS 操作HTML 事件函数JavaScript 特效和动画HTML DOM 遍历和修改AJAXUtilities。
2023-09-14 11:37:46
118
原创 js其他方法
getDate() 返回月中的第几天(从 1 到 31)。getDay() 返回星期几(0-6)。getFullYear() 返回年份。getHours() 返回小时(从 0-23)。getMilliseconds() 返回毫秒(0-999)。getMinutes() 返回分钟(从 0-59)。getMonth() 返回月份(从 0-11)。getSeconds() 返回秒数(从 0-59)。getTime() 返回自 1970 年 1 月 1 日午夜以来与指定日期的毫秒数。
2023-09-14 11:32:38
82
原创 BOM操作
文章目录BOM事件页面加载调整窗口事件定时器停止计时器Location对象History对象Offsetleft获取元素偏移Offset与style的区别可视区client系列滚动scroll系列Mouseover和mousenter区别动画原理实现动画封装给不同对象添加定时器缓动动画原理多个位置间移动BOM事件页面加载调整窗口事件定时器停止计时器Location对象History对象Offsetleft获取元素偏移Offset与style的区别可视区clie
2023-09-14 11:08:05
605
原创 媒体查询技术
媒体查询(Media Query)是CSS3新语法。使用@media查询,可以针对不同的媒体类型定义不同的样式@media可以针对不同的屏幕尺寸设置不同的样式当你重置浏览器大小的过程中,页面也会根据浏览器的宽度和高度重新渲染页面目前针对很多苹果手机、Android手机,平板等设备都用得到媒体查询。
2023-09-14 11:00:43
154
原创 【CSS3】
模块CSS3 被拆分为"模块"。旧规范已拆分成小块,还增加了新的。一些最重要 CSS3 模块如下:选择器盒模型背景和边框文字特效2D/3D转换动画多列布局用户界面。
2023-09-14 10:50:48
273
原创 vue Router从入门到精通
Vue Router 是 Vue.js 的官方路由。它与 Vue.js 核心深度集成,让用 Vue.js 构建单页应用变得轻而易举。嵌套路由映射动态路由选择模块化、基于组件的路由配置路由参数、查询、通配符展示由 Vue.js 的过渡系统提供的过渡效果细致的导航控制自动激活 CSS 类的链接HTML5 history 模式或 hash 模式可定制的滚动行为URL 的正确编码理解。
2023-09-06 21:35:05
418
8
原创 vue中解决ajax跨域问题(no “access-control-allow-origin”)
工作方式:若按照上述配置代理,当请求了前端不存在的资源时,那么该请求会转发给服务器 (优先匹配前端资源)例如:本机是locahost:8080 要给locahost:5000发请求,那么配置的就是5000。跨域是是因为浏览器的同源策略限制,是浏览器的一种安全机制,服务端之间是不存在跨域的。当请求的资源本机原本就存在时,就不会发送请求,如果解决这个问题,请看方式二。优点:可以配置多个代理,且可以灵活的控制请求是否走代理。缺点:不能配置多个代理,不能灵活的控制请求是否走代理。常见的跨域解决方法有。
2023-08-29 16:38:30
614
原创 js相关题解
1、从 start 到 end(包含 start 和 end),每隔 100 毫秒 console.log 一个数字,每次数字增幅为 1。+ 代表匹配前面的表达式一次或多次 2、[ \da-z.-]+ : [ ] 代表中括号表达式的开始。- 代表匹配 – 3、([a-z]+|[\u4E00-\u9FFF ]+)$: ()代表子表达的开始。1、^\w + : ^ 代表以后面的开头。\d 代表[0-9]的数字,取其一。a-z 代表小写字母,取其一。\w代表数字+字母+下划线。
2023-08-24 21:37:05
124
原创 Vuex从入门到精通
vuex是什么?官方给出的解释是:Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式 + 库。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。看完官方解释后,你可能对状态管理模式很疑惑,对于状态管理模式,官方给出了详细的解释。状态,驱动应用的数据源;视图,以声明方式将状态映射到视图;操作,响应在视图上的用户输入导致的状态变化。详细的视图演示如何理解这个图示呢?
2023-08-21 15:28:22
511
14
原创 vue组件间通信
1.一种组件间通信的方式,适用于:子组件 ===> 父组件2.使用场景:A是父组件,B是子组件,B想给A传数据,那么就要在A中给B绑定自定义事件(事件的回调在A中)。第一种方式,在父组件中: 或 第二种方式,在父组件中:......mounted(){// 若想让自定义事件只能触发一次,可以使用once修饰符,或$once方法。
2023-08-17 16:10:16
385
28
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人