自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(231)
  • 收藏
  • 关注

原创 es6的新特性

ECMAScript 6(也称为 ES6 或 ECMAScript 2015)是 JavaScript 的一个重要更新版本,引入了许多新的语法和功能,以提高开发效率和代码可读性。这些是 ES6 中的一些比较常见和重要的新特性,它们使得 JavaScript 更加现代化和强大,为开发者提供了更多的工具和功能来提高开发效率和代码质量。ES6 引入了类和基于原型的继承机制,使得 JavaScript 更具面向对象的特性,并且提供了更清晰的类和继承语法。箭头函数提供了更简洁的函数声明语法,并且自动绑定了。

2024-03-10 23:41:56 339

原创 页面插入元素

页面插入元素是指通过 JavaScript 在页面中动态创建元素并将其插入到指定位置的操作。这在 Web 开发中非常常见,可以用来实现动态内容的加载、用户交互的响应等功能。这些方法可以根据需要选择合适的方式来在页面中插入元素,具体选择哪种方法取决于具体的场景和需求。

2024-03-10 23:41:18 301

原创 vue如何优化首页加载速度

可以使用 Vue Router 的懒加载功能来实现路由组件的按需加载,或者使用动态 import() 来实现模块的按需加载。对于页面中的组件,可以将一部分组件延迟加载,只在需要时才加载和渲染。可以设置静态资源的缓存头信息,或者使用 Vue Router 的路由缓存功能来缓存页面组件。可以使用 Webpack 的代码拆分功能和文件合并插件来优化静态资源的加载。使用 CDN(内容分发网络)来加速静态资源的加载,将静态资源部署到全球各地的 CDN 节点,减少网络延迟和提高资源加载速度。

2024-03-10 23:38:12 492

原创 vue权限管理

控制用户在访问不同页面时的权限。可以通过路由守卫(路由导航守卫)来实现,在用户跳转到某个路由之前检查用户的权限,决定是否允许访问。路由守卫来检查用户的权限,如果用户没有访问某个路由的权限,则跳转到登录页面或其他提示页面。同时,我们在路由配置中使用。控制页面中的某些组件或元素的显示与隐藏,根据用户的角色或权限动态渲染页面。控制用户在访问后端接口时的权限,只允许具有特定权限的用户进行某些操作。字段来定义每个路由需要的权限,然后在路由守卫中进行检查。在上面的示例中,我们首先通过。

2024-03-10 23:37:28 300

原创 vue中的性能优化

可以使用 Vue Router 的懒加载功能或者 Vue 的异步组件来实现组件级别的懒加载。同时,使用 watch 属性来监听数据的变化,及时响应数据的变化。使用合适的数据绑定方式(如 v-bind、:class、:style)来避免不必要的数据更新,减少虚拟 DOM 的重渲染。以上是一些常见的 Vue.js 性能优化方法,可以根据具体的项目需求和情况选择合适的优化策略,并进行适当的测试和调整。对于需要缓存的组件,可以使用 keep-alive 组件来缓存组件的状态,避免组件被频繁销毁和重建。

2024-03-10 23:36:18 350

原创 如何清除keep-alive缓存

这些方法可以根据具体的需求来选择使用,如果需要在代码中动态地控制组件的缓存和销毁,建议使用第二种方法;如果需要在组件内部手动触发清除缓存,可以使用第一种方法。组件可以将组件保留在内存中,以避免重复渲染和销毁,从而提高性能。然后,在需要清除缓存的时候调用。在 Vue.js 中,使用。

2024-03-09 22:45:06 853

原创 路由拦截器

使用路由拦截器通常需要根据具体的开发框架或库来实现。一般而言,开发者需要在路由配置中注册拦截器,并指定拦截器应该执行的操作。拦截器会在路由处理管道中的特定位置被调用,并根据条件决定是否拦截请求或对请求进行特定的处理。路由拦截可以分为几种不同的类型,每种类型都有其特定的作用和适用场景。

2024-03-09 08:00:10 377

原创 css优化的方法

CSS(Cascading Style Sheets)优化是前端开发中的重要环节,它能提高网站的性能和用户体验。以上是一些常见的CSS优化方法,但并不是全部。在实际开发中,还需要根据项目的具体情况来选择合适的优化策略。

2024-02-25 08:00:00 324

原创 set和map的区别

总的来说,Set和Map的主要区别在于它们的结构、唯一性、操作、遍历、查找和其他特性。你应该根据你的具体需求来选择使用Set还是Map。

2024-02-25 07:49:07 338

原创 es6的新特性

这些新特性使得JavaScript在编写更大型、更复杂的应用程序时更加高效和灵活。同时,它们也促进了更好的代码组织和可维护性。

2024-02-25 07:30:00 349

原创 事件代理和事件委托

它们都是利用事件冒泡机制,将事件监听器绑定到父元素或祖先元素上,而不是直接绑定到目标元素上。这样,当事件在目标元素上触发时,由于事件冒泡机制,事件会冒泡到父元素或祖先元素,从而触发绑定在它们上的事件监听器。需要注意的是,事件代理或事件委托并不适用于所有情况。例如,如果目标元素需要阻止事件冒泡,或者需要获取事件对象中的特定属性(如。选择器,那么就知道被点击的是子元素,并可以执行相应的处理逻辑。当点击事件在该元素或其子元素上触发时,),那么可能需要直接在目标元素上绑定事件监听器。会指向被点击的元素。

2024-02-24 14:45:00 368

原创 什么是高阶组件

高阶组件在 React 社区中非常受欢迎,因为它们提供了一种将组件逻辑与 UI 分离的方式,使得组件更加模块化和可重用。简单来说,高阶组件就是一个函数,该函数接受一个组件作为参数,并返回一个新的组件。这个新的组件会使用你传给它的组件作为子组件。因为高阶组件只是接收一个组件并返回一个新的组件,它们不会修改或复制其输入组件的任何行为,因此被称为“纯”组件。高阶组件的参数为一个组件,返回一个新的组件,这个新的组件可以使用原组件的 props,并添加或修改一些行为。

2024-02-24 14:15:00 213

原创 小程序分包的详细流程

从独立分包中的页面进入小程序时,不需要下载主包。这可以按需将某些具有一定功能独立性的页面配置到独立分包中,提升分包页面的启动速度。以上是小程序分包的详细流程,通过分包可以优化小程序的结构和性能,提高用户体验。:在微信开发工具中,你可以在“详情”->“基本信息”面板中查看项目及分包信息。:在项目根目录下创建分包文件夹,用来存放除底部菜单栏页面之外的其他页面。文件,在里面进行分包文件的配置。需要写全分包的配置,并修改原来项目中跳转页面的路径。文件夹下只保留底部菜单栏对应的页面,确保文件大小最小。

2024-02-24 14:00:00 607

原创 小程序如何实现微信支付

请注意,以上代码仅作为示例,实际使用时你需要根据自己的业务逻辑和微信支付的相关规则进行适当的调整。同时,为了保障支付的安全性,务必妥善保管你的API密钥,并确保在传输和存储敏感信息时采取适当的安全措施。

2024-02-24 13:45:00 644

原创 数组的操作方法

数组是编程中常见的数据结构,它允许存储多个元素,并且可以通过索引访问这些元素。在实际编程中,建议查阅相关编程语言的文档或教程以获取更详细和准确的信息。例如,在Python中,可以使用列表(list)作为数组,使用。例如,在Python中,可以使用。:通过索引访问数组中的元素。例如,在Python中,:大多数编程语言都提供了查找数组中元素的方法。例如,在Python中,可以使用。例如,在Python中,可以使用切片语法。:反转数组中的元素顺序。例如,在Python中,可以使用。:通过索引修改数组中的元素。

2024-02-24 09:22:58 625

原创 本地开发环境请求服务器接口跨域的问题(vue的问题)

axios的封装,主要是用来帮我们进行请求的拦截和响应的拦截。在请求的拦截中我们可以携带userToken,post请求头、qs对post提交数据的序列化等。在响应的拦截中,我们可以进行根据状态码来进行错误的统一处理等等。axios接口的统一管理,是做项目时必须的流程。这样可以方便我们管理我们的接口,在接口更新时我们不必再返回到我们的业务代码中去修改接口。本地开发项目请求服务器接口的时候,因为客户端的同源策略,导致了跨域的问题。我们在1出设置了允许本地跨域,在2处,要注意我们访问接口时,写的是。

2024-01-21 07:45:00 1099

原创 列表进入详情页传参问题(vue的问题)

注意,params传参时,如果没有在路由中定义参数,也是可以传过去的,同时也能接收到,但是一旦刷新页面,这个参数就不存在了。这对于需要依赖参数进行某些操作的行为是行不通的,因为你总不可能要求用户不能刷新页面吧。params动态路由传参,一定要在路由中定义参数,然后在路由跳转的时候必须要加上参数,否则就是空白页面。此时在c页面可以通过id来获取对应的详情数据,获取id的方式是。vue传参方式有:query、params+动态路由传参。vue传参方式有:query、params+动态路由传参。

2024-01-20 12:45:00 436

原创 组件之间传值(vue的问题)

在 Vue.js 中,父子组件的关系可以总结为 props down, events up。父组件通过 props 向下传递数据给子组件,子组件通过 events 给父组件发送消息。我么可以根据实际情况灵活使用子父组件之间的传递值来完成交互。父组件获取子组件的值:父组件 index.vue。如果需要在父组件中点击子组件,那么需要使用,子组件:viewMore.vue。子组件:viewMore.vue。

2024-01-20 07:30:00 386

原创 组件开发遇到的问题(vue的问题)

当我们将项目中公用的块,或者页面中多处样式一样,只是数据展示不同的地方抽取出一个个公用组件时,可以提高我们的开发效率,避免重复的工作,只需要在不同的页面引入公用的组件即可。创建一个viewMore.vue文件,定义一个组件块。这样就可以在其它组件引用了,引用方式很简单:例如在index.vue中引进viewMore.vue组件,假设两个文件处在同级目录中。

2024-01-19 21:26:49 569

原创 Vue动态添加新的属性到实例上(vue的问题)

当我们去看vue文档的时候,发现如果在实例创建之后添加新的属性到实例上,它不会触发视图更新。比如我们我们开始创建了一个对象实例,在实例创建之后为其增加新的属性,我们发现这个属性不能生效,此时需要使用this.$set(')方法。

2024-01-19 21:25:33 318

原创 组件中写选项的顺序(vue的问题)

为什么选项要有统一的书写顺序呢?很简单,就是要将选择和认知成本最小化。

2024-01-17 20:01:51 613

原创 rem文件的导入问题(vue的问题)

我们在做手机端时,适配是必须要处理的一个问题。例如,我们处理适配的方案就是通过写一个rem.js,原理很简单,就是根据网页尺寸计算html的font-size大小,基本上小伙伴们都知道,这里直接附上代码,不多做介绍。这里说下怎么引入的问题,很简单。在main.js中,直接。import的路径根据你的文件路径去填写。

2024-01-17 19:59:56 354

原创 Vue-Awesome-Swiper基本能解决你所有的轮播需求(vue的问题)

在我们使用的很多ui库(vant、antiUi、elementUi等)中,都有轮播组件,对于普通的轮播效果足够了。但是,某些时候,我们的轮播效果可能比较炫,这时候ui库中的轮播可能就有些力不从心了。当然,如果技术和时间上都还可以的话,可以自己造个比较炫的轮子.这里我说一下。这个轮播组件,真的非常强大,基本可以满足我们的轮播需求。swiper相信很多人都用过,很好用,也很方便我们二次开发,定制我们需要的轮播效果。附上文档:npm文档,swiper3.0/4.0文档,更多用法,请参考文档说明。

2024-01-14 06:25:36 451

原创 定时器问题(vue的问题)

类似于其他需要在当前页面使用,离开需要销毁的组件(例如一些第三方库的picker组件等等),都可以使用此方式来解决离开后以后在背后运行的问题。综合来说,我们更推荐使用。我在a页面写一个定时,让他每秒钟打印一个1,然后跳转到b页面,此时可以看到,定时器依然在执行。这样是非常消耗性能的。该方法是通过$once这个事件侦听器器在定义完定时器之后的位置来清除定时器。

2024-01-14 06:23:40 435

原创 如何优雅的只在当前页面中覆盖ui库中组件的样式(vue的问题)

我们正常写的所有样式,都会被加上[data-v-23d425f8]这个属性(如1所示),但是第三方组件内部的标签并没有编译为附带[data-v-23d425f8]这个属性。所以,我们想修改组件的样式,就没辙了。怎么办呢,有些小伙伴给第三方组件写个class,然后在一个公共的css文件中或者在当前页面再写一个没有socped属性的style标签,然后直接在里面修改第三方组件的样式。约定特定的命名方式,可以避免命名冲突。至此你可以愉快的修改第三方组件的样式了。更多的关于深度选择器的内容,在文章后面有介绍。

2024-01-13 03:05:36 550

原创 UI库的按需加载(vue的问题)

等,很多ui库都支持按需加载,可以去看文档,上面都会有提到。基本都是通过安装babel-plugin-import插件来支持按需加载的,使用方式与vant的如出一辙,可以去用一下。为什么要使用按需加载的方式而不是一次性全部引入,原因就不多说了。

2024-01-12 07:15:00 352

原创 本地开发环境请求服务器接口跨域的问题(vue的问题)

axios的封装,主要是用来帮我们进行请求的拦截和响应的拦截。在请求的拦截中我们可以携带userToken,post请求头、qs对post提交数据的序列化等。在响应的拦截中,我们可以进行根据状态码来进行错误的统一处理等等。axios接口的统一管理,是做项目时必须的流程。这样可以方便我们管理我们的接口,在接口更新时我们不必再返回到我们的业务代码中去修改接口。本地开发项目请求服务器接口的时候,因为客户端的同源策略,导致了跨域的问题。我们在1出设置了允许本地跨域,在2处,要注意我们访问接口时,写的是。

2024-01-11 20:50:21 635

原创 列表进入详情页的传参问题(vue的问题)

注意,params传参时,如果没有在路由中定义参数,也是可以传过去的,同时也能接收到,但是一旦刷新页面,这个参数就不存在了。这对于需要依赖参数进行某些操作的行为是行不通的,因为你总不可能要求用户不能刷新页面吧。,可以看到传了一个参数id=1,并且就算刷新页面id也还会存在。此时在c页面可以通过id来获取对应的详情数据,获取id的方式是。来接收参数,params通过this.$route.params来接收参数。1.query通过path切换路由,params通过name切换路由。

2024-01-11 17:50:58 483

原创 组件中使用定时器及销毁问题(vue的问题)

通常能想到的常规解决办法就是,在data属性中定义一个timer,在代码中启动定时器,然后在组件销毁的时候清除定时器。Vue官方文档给出的解决方案是,在定义timer的时候使用$once指令监听beforeDestroy这个钩子函数。如果我们在页面A中使用了一个定时器,当从页面A跳转到页面B时,如果不手动清除这个定时器,那么它仍旧会执行,这不是我们所期望的。我们的建立代码独立于我们的清理代码,这使得我们比较难于程序化地清理我们建立的所有东西。类似的这种在离开页面时需要销毁的组件都可以采用此方法。

2024-01-09 22:32:10 651

原创 Object.defineProperty(js的问题)

示例:数据响应式 vue。

2024-01-06 21:45:00 552

原创 this的使用(js的问题)

指代当前调用的这个对象。实现一个bind方法。

2024-01-06 07:00:00 703

原创 call、apply、bind的使用场景区分(js的问题)

类似call, 不同之处在于call调用之后立即执行,bind需要一个变量进行接收之后再执行。call、apply、bind都是Function对象的方法。1、apply调用一个函数,可以指定this值。

2024-01-05 13:00:00 368

原创 闭包(js的问题)

引用了自由变量的函数,这个被引用的自由变量将和这个函数一同存在;所以,闭包是由函数和其他相关的引用环境组合而成,实现信息驻留;闭包导致内存驻留,如果是大量对象的闭包环境需要注意内存消耗。ES6中使用let定义局部变量也可以实现输出0 1 2。即使已经离开了创造它的环境也不例外。闭包的概念Closure:作用域。信息的保存,引用在,空间不销毁。

2024-01-05 07:00:00 549

原创 重载和多态的使用场景(js的问题)

重载:定义相同名称,不同参数的函数,程序调用时自动识别不同参数的函数。js中没有重载,可以通过arguments实现函数重载。多态:同一个东西在不同情况下表现不同状态,重写和重载。实现了相同函数名不同的函数调用。

2024-01-04 22:25:27 358

原创 作用域和作用域链(js的问题)

• 作用域链scope chain:以当前作用域的scope属性为起点,依次引用每个AO,直到window结束,行成多级引用关系。• 作用域scope: 一个变量的可用范围。• 函数作用域 function(){}s的变量和函数作用域是在定义是决定的,而不是运行时决定。• 全局作用域 window。• 全局作用域,函数作用域。js的变量作用域在函数体内有效,无块作用域。

2024-01-04 08:00:00 383

原创 变量和函数提升(js的问题)

如果是var赋值声明的函数,变量提前,函数体停留在本地。• 函数声明提前:整个函数体提前。• 变量声明提前:值停留在本地。变量声明提前,函数声明提前。

2024-01-04 07:00:00 424

原创 常见函数的4种类型(js的问题)

优点:节约内存空间,掉用前和调用后内存中不创建任何函数对象。arguments.callee 严格模式下不支持使用。Person 既是函数名,也是这个对象的类名。如果一个函数作为对象交给其他函数使用。定义时候没有任何变量引用的函数。匿名函数自调:函数只执行一次。2、回调函数callback。调用方式不一样,作用也不一样。构造函数习惯上首字母大写。构造函数用来新建实例对象。

2024-01-03 22:18:18 611

原创 使用History和location(js的问题)

window.location和document.location。window.hostory 属性指向History对象。表示当前窗口的浏览历史。

2023-12-29 07:45:00 375

原创 阻止默认行为的两种方式(js的问题)

让form表单不提交。

2023-12-29 07:00:00 372

原创 事件触发、事件捕获与事件冒泡(js的问题)

事件触发时包含了事件发生的元素和属性信息。事件冒泡的应用:事件委托。

2023-12-28 22:25:09 392

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除