自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 vue 跳转新窗口的方法

适用于有新的完整的链接跳转,将新链接的url放入open中即可。2.使用$router.resolve。适用于@绑定了点击事件需要跳转的场景。1.使用router-link。

2024-07-03 16:34:06 453

原创 uniapp 使用vite构建项目

(3)App.vue 引入基础样式(注意style标签需声明scss属性支持)(4)uni.scss 引入全局 scss 变量文件。(2)在main.js中引入vk-uview-ui。(1)使用hbuilder导入插件。

2024-06-30 20:20:03 347

原创 css transition实现箭头上下来回动

【代码】css transition实现箭头上下来回动。

2024-04-14 19:00:49 249

原创 vue 滚动到指定位置scrollIntoView

想要实现点击箭头就网上翻一页的效果。点击箭头页面滑动到红色长方形区域。

2024-04-14 10:10:27 379

原创 vue2隐藏浏览器右侧滚动条

3.在全局css/scss/less中配置。右侧滚动条就消失啦~

2024-04-12 12:05:31 618 1

原创 img使用 :src 动态绑定图片地址,图片不成功

此时图片没有出现,控制台报错 http://localhost:8080/assets/animals1.jpeg 404 (Not Found)使用vue cli 创建的vue2项目,项目中想实现轮播效果。使用require引入图片,完整代码如下,此时图片引入成功。使用 :src 动态绑定图片地址,图片没有出现。此时控制台中出现的图片地址是。

2024-04-12 11:55:21 667

原创 vue2 配置@指向src

path使用的是vue cli创建的项目。

2024-03-19 21:53:56 320

原创 uniapp实现点击标签文本域中显示标签内容

③.点击标签右上角的删除可删掉标签,同时清除文本域中标签的内容。使用的是uniapp+vue3+uVieww-plus。①.点击标签时,标签改变颜色并处于可删除状态。④.可输入内容,切换时不影响输入的内容。有些样式在全局定义的,自行设置样式。②.切换标签,文本域中出现标签的内容。

2024-03-12 19:00:21 1311

原创 webpack 打包后,图片加载错误

使用webpack打包后,图片没有加载出来,页面空白,报错图片引用的路径不对。

2024-03-05 12:10:29 751

原创 数字快速增长动画插件vue-countupjs

属性 意义 默认值tag 数字的包装器 spanstartValue 起始值 0。

2024-03-01 15:47:53 1254 1

原创 px转为rem方法之插件postcss-plugin-px2rem的使用方法

①安装webpack打包工具:npm install webpack -g②搭建vue脚手架:npm install -g vue-cli③创建vue项目:vue init webpack "项目名称"

2024-02-29 13:31:18 1980

原创 JOSN.parse()报错 Unexpected end of JSON input at JSON.parse (<anonymous>)

使用uniapp写微信小程序,在页面带参传值时,出现了报错Unexpected end of JSON input at JSON.parse ()此时b.vue页面的JSON.parse报错。a.vue 传递数据页面。b.vue 接收数据页面。

2024-02-26 16:12:09 1580

原创 uniapp自定义顶部状态栏

使用的是vite + vue3的setup语法糖。2.创建components目录,在components目录下创建navbar.vue组件顶部状态栏实际上分为两个部分,一个是系统状态栏,一个是状态栏的下方的内容区域。大致就是图上两个部分。结构分出来后也就比较明了先要做啥了。不同手机顶部的系统状态栏的高度是不一样的,可以通过方法 获取顶部安全区域高度。拿到方法中的两个属性statusBarHeight,system。由于iOS有刘海屏所以,iOS的内容高度为88。首先当我们

2024-01-04 10:59:51 3973

原创 uniapp vue3父子间传值

使用的是setup语法糖。

2023-12-29 15:43:43 960

原创 闭包的特点及造成的问题

MDN官网是这样说的闭包(closure)是一个函数以及其捆绑的周边环境状态(词法环境)的引用的组合。换而言之,闭包让开发者可以从内部函数访问外部函数的作用域。在 JavaScript 中,闭包会随着函数的创建而被同时创建。简而言之,闭包就是可以访问另一个作用域的变量的函数。');closure();// 输出: Hello World!怎么理解“闭包(closure)是一个函数以及其捆绑的周边环境状态(词法环境。

2023-12-25 16:34:51 394

原创 前端WebSocket相关问题

WebSocket 是 HTML5 提供的一种在单个 TCP 连接上进行全双工通讯的协议。全双工通讯就是可以双向通信,浏览器和服务器一旦建立连接(也就是需要完成一次握手),通过WebSocket两者就可以实现持续性和长久性的通信。

2023-12-22 16:53:58 467

原创 什么是Nginx代理跨域

简单来说正向代理就是代理服务器帮助客户端去向服务器发送请求。比如说访问外网,自己(客户端)是访问不了外网的,通过一个特殊网站(代理服务器),可以访问到了外网,这个过程就叫正向代理。正向代理主要主动设置代理服务器ip或者域名进行访问,由设置的代理服务器ip或者域名去访问目的服务器,目的服务器再返回内容。(1)突破访问限制通过正向代理可以去访问外国网站。(2)提高访问速度。

2023-12-22 11:41:18 417

原创 跨域及解决跨域问题的详细解释

跨域是一个浏览器安全策略,用于防止恶意网站通过 JavaScript 代码访问来自其他网站的资源。同源策略要求网页只能访问与其来源相同的资源,即具有相同的协议(如http或https)、域名和端口号。例如,假设你的网站位于https://www.example.com,如果你在 JavaScript 中尝试通过XMLHttpRequest请求 https://www.google.com 的数据,这就是一个跨域请求,因为域名不同。跨域请求默认会被浏览器阻止,因为这可能会导致安全问题。

2023-12-21 11:45:36 1060

原创 reduce()详解

在JavaScript中,reduce()是一个高阶函数,它接受一个回调函数作为参数,并使用该回调函数将一个数组或类数组对象的每个元素汇总为单个值。它的工作原理是迭代数组的每个元素,然后在每次迭代中将结果传递给下一次迭代。reduce()其中,array是要操作的数组,callback是一个回调函数,是可选的初始值。回调函数callback接受四个参数:累积值(初始值或前一次回调的结果)、当前元素、当前索引和整个数组。在示例代码中,reduce()

2023-12-18 23:29:15 853 1

原创 可以对数据进行筛选的方法

使用传统的 for 循环对数据进行筛选。你可以遍历数组的每个元素,根据筛选条件进行判断,并将符合条件的元素添加到新的数组中。

2023-12-16 23:25:30 545 1

原创 一个容器里面有个正方形,不管容器的长和宽怎么变化,正方形的边长始终是容器长的一半,怎么设置正方形的CSS属性

此题目为某厂的面试题,在这里做个解答。要实现这个效果,可以使用 padding-top 或者 padding-bottom 的百分比值来实现正方形,因为这两个属性值的百分比是相对于父元素的宽度来计算的。可能会有疑问,为什么square容器没有设置高度,也会有高度,还是container容器宽度的50%。

2023-12-15 14:34:14 957 1

原创 基于el-table组件实现二次封装

data中的数据大家根据实际需求进行写就行了,然后再methods中去写每一个按钮需要的方法。属性,就会使用自定义插槽的内容来渲染该列,否则会使用默认的列渲染。关于分页组件具体的封装在这篇博客里写了,大家自取!属性,表明需要自定义该列的内容,那么内部的。来创建一个作用域插槽,并将该插槽命名为。组件会被放置在插槽标记的位置,通过。的属性,如果有的话,则使用插槽 (这样,当表格渲染时,如果列对象中有。将其赋予相同的插槽名称,并传递。) 来自定义列的内容。数组中的每个元素时,对象作为插槽的数据。

2023-12-13 15:25:42 683 1

原创 基于el-pagination组件实现二次封装

1.在components文件夹中新建Pagination文件夹,创建index.vue文件封装了 scrollTo方法,目的是实现滚动平滑效果。

2023-12-13 13:57:45 502 1

原创 vue2使用svg图标集

svgo-loader`用于优化、压缩和处理SVG文件,而`svg-sprite-loader`用于将多个独立的SVG图标文件合并为一个SVG精灵文件,并提供在应用中引用和使用这些图标的便利性。结合使用,以实现最佳的SVG图标集成和优化。下载依赖`svgo-loader`和`svg-sprite-loader`icons文件下放所有后缀为svg的图标。可单独设置类名来控制svg的颜色和大小。在main.js中引入全局文件。可创建一个装全局的js文件。icon名称一定要对应!

2023-12-01 14:40:33 623 1

原创 使用this.$nextTick的情况

$nextTick 的作用就是将回调函数延迟到下一次更新循环之后再执行,并且在回调函数中能够获取到最新的数据值。在 Vue 中,当数据发生变化时,它并不会立即更新视图。相反,Vue 会将这些数据的变化缓存起来,等到下一次 DOM 更新循环时一次性更新视图。这样,可以避免一些性能问题和重复更新视图造成的浪费。

2023-12-01 14:31:28 384 1

原创 VUE Redirected when going from “/login“ to “/dashboard“ via a navigation guard. 报错

如果用户未输入信息点击登录按钮,此时handleLogin()方法会执行跳转到主页面,这个过程中进行跳转拦截,没有拿到token,执行 next(‘/login’),此时从。错误原因:在 Vue 的路由中使用了导航守卫(navigation guard),在从 “/login” 页面跳转到 “/dashboard” 页面时被重定向。如果用户输入的登录信息正确后,点击登录按钮,此时进行跳转拦截,拿到token,进入主页面;(主页面’/')页面时,导航守卫重定向到了。页面,导致了一个无限循环的重定向。

2023-08-31 15:15:38 866 1

原创 安装vue-cli脚手架——手动配置

表示在 C:\Users\淇淇\Desktop 这个路径下创建了一个名叫 vue_test的项目。用空格键选择babel、router、vuex、linter/rormatter,然后enter。等待下载,下载完成后安装,根据自己的需求改变路径,其他的一直点next就可以了。如果安装成功则会出现安装的版本,没有出现则是安装成功。回车后会出现:选择手动配置。进入test2文件夹。

2023-05-17 11:17:10 308 1

原创 axios模块的安装和使用

步骤二:在src/util/request.js中定义并暴露request对象为进行了基础配置的axios,指定了接口的总地址。步骤三:在src/api目录中创建js文件夹引入request,定义接口请求方法。步骤一:在main.js 中使用prototype定义一个对象为axios。步骤一:在src/util/request.js文件中导入axios模块。步骤二:在需要请求的接口组件中,直接使用this.步骤五:在需要请求的方法直接调用方法。http.post请求接口。在使用的组件中倒入模块。

2023-05-07 15:29:15 3364

原创 vue init webpack xxx安装不成功

Command vue init requires a global addon to be installed. Please run undefined @vue/cli-init and try again

2023-05-01 17:22:40 594

原创 canvas动画——弹跳小球

canvas动画

2023-04-01 23:44:04 513

原创 安装vue-cli脚手架

vue-cli脚手架的安装

2023-03-20 10:31:02 41

原创 Vue笔记(尚硅谷,笔记会续更)

尚硅谷Vue笔记

2023-01-29 20:59:32 176

原创 ES6笔记(kerwin老师)

ES6特性

2023-01-20 21:10:24 478

原创 JS改变this指向(pink老师)

JavaScript为我们专门提供了一些函数方法来帮我们更优雅的处理函数内部 this的指向问题,常用的有bind()、call()、apply() 三种方法。

2023-01-17 18:28:37 95

原创 JS购物车

【代码】JS购物车。

2023-01-17 16:45:14 226

原创 JS实现简易计算器

由于事件的绑定为行内绑定,所以在js里面直接写相应的函数。因为只是做一个小案例所以采用了这样的写法,如果是用来写一些项目不太建议用行内绑定,行内绑定不太利于代码的维护。slice(begin,end) 截取包括 begin,不包括end,返回一个新的数组对象,原始数组不会被改变。eval() 的参数是一个字符串,如果字符串表示的是表达式,eval() 会对表达式进行求值。(2)将输入框中的得到的值通过eval()方法来进行计算。(1)将点击的数字和符号的值渲染到我们的输入框中。什么是eval()方法?

2023-01-04 16:52:58 989

空空如也

空空如也

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

TA关注的人

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