- 博客(25)
- 收藏
- 关注
原创 vue2.0+echarts实现多省份地图加双柱状图展示(保姆级教程)
首先放效果图开始之前我默认您已成功下载和导入相关插件打开 http://datav.aliyun.com/portal/school/atlas/area_selector#&lat=30.230594564932193&lng=98.316650390625&zoom=6鼠标点击你想要的省份 然后在右边根据需要看是否勾选(包含子区域),如果勾选了就会有市地区级的坐标,我这个项目是不需要的,所以不勾选,然后根据需要点击第三行------其他类型 点击下载保存 你会得到该省份的 文件 ,然后依次下载需
2024-07-25 17:52:07
407
原创 使用 fetchEventSource 实现sse流式请求
/ onclose函数是会话结束正常关闭触发,但几乎没有做到这步,不执行这个回调,不知道什么原因。//我这里是判断我请求回来的数据里是否包含'[DONE]',他是数组里的最后一项,表示加载完成。// console.log('接口返回', JSON.parse(event.data))// console.log('SSE会在通过事件源收到数据时触发')// 开始会话链接,也做了个全局的......// 终止or结束会话,做了个全局的...// 关闭业务,执行关闭sse数据接口。'SSE结束会话了'
2024-07-08 10:59:18
1315
1
原创 vue2.0中动态绑定img的src属性的方法(三元运算)
函数在构建时会解析图片路径,并将图片打包到正确的位置。使用 require 可以确保路径在打包时正确解析。可以用于在运行时加载资源,但这种方法通常用于更复杂的场景,如按需加载模块。在标签里进行三元运算符判断的时候,引用地址外层需要加require()使用computed属性来动态计算img的src路径。/* 你的样式 */
2024-07-08 10:17:43
722
原创 jquery踩坑之tab选项卡切换,标题栏包含icon小图标跟着对应切换
下面css最重要的 是.soft_rows.soft_active .icon1,.soft_rows.soft_active .icon2,.soft_rows.soft_active .icon3这一部分。先给大家看下我的需求稿 tab切换实现不难 但是左侧标题栏的小图标切换的时候跟着变 着实有一丢丢费我脑子~~太菜了没办法(暴风式哭泣)由于左侧有10个标题栏 太多 在这里演示的时候 我只写前几个。我想了想 然后让设计给我做了张雪碧图 开干~
2024-04-12 13:28:13
440
原创 踩坑之video视频无法正常播放
但是 视频不会自动播放,成了静止的一张图片 给video设置的autoplay属性没有生效 然后翻阅了很多文档 知道问题了 少了一个属性“”之后就可以正常播放了 但是还有个问题 在 iOS无法自动播放 然后就还需要一个属性“首先说下我的需求:就是视频放在头部自动循环播放,不需要手动操作。所以最后的完整代码是。
2024-04-12 09:15:19
263
原创 css实现页面内容区撑满全屏(内容全屏自适应)
然后 我使用了第二个办法 成功解决 那就是使用 position定位。我刚开始想到的思路是 左边内容使用浮动 右边自适应。
2024-03-29 10:16:01
456
原创 用jquery实现页面滚动加点击事件对应的导航栏高亮
我的需求是 当页面滚动的时候 让导航栏浮动定位 同时让下面内容区滚动的时候对应的导航栏标题高亮 同时点击导航栏标题的时候 下面的内容也滚动到对应区域 实现思路 主要是使用到 data-target 自定义属性。没有说的是 最原始的需求是最上面的视频也需要吸顶 然后继续滚动导航栏也需要浮动定位 在这篇博文里 我把视频模块吸顶的实现给删除了。如果大家在食用的过程中发现这瓜不保熟 那就检查下你们的页面样式 是否有。
2024-01-10 14:30:11
550
1
原创 简单的jquery实现一个吸顶功能
在实现的过程中遇到一个问题 浪费了一些时间 就是在计算页面滚动的高度的时候计算不出来 打印 $(document).scrollTop();打印不出来 就感觉很奇怪 然后搜了很多文档 问题是在我的css文件里有一个样式。这个样式导致监听不到正确的页面滚动高度 但是别的页面我需要这个样式 解决办法就是在当前页面里把样式改成 overflow: visible;
2024-01-05 09:29:06
447
原创 解决css中border渐变色和border-radius一起用border-radius失效的问题
我们都知道border-radius属性是实现边框圆角的,当我们给border设置渐变色的时候是用到border-image,会发现此时设置border-radius会失效。
2023-12-12 09:38:43
1515
原创 用css实现文字字体颜色渐变的三种方法
通过url属性引用SVG图像, SVG是一种用于描述矢量图形的XML标记语言。利用这个属性,我们可以在文字中嵌入SVG图像,实现渐变色效果。background-clip是CSS3中新增的属性,可以用于指定背景图片或颜色的绘制范围。以上三种方法都可以实现文字的颜色渐变。
2023-11-09 10:18:13
21528
7
原创 解决微信小程序中‘ ;‘占位符失效的问题
查文档 看到官网上 text标签有个属性decode。这个属性只有text有 设置在view上不生效。专属权益 尽享福利。>专属权益 尽享福利。
2023-09-20 09:59:20
729
原创 vue报错: Do not use built-in or reserved HTML elements as component id:title
Do not use built-in or reserved HTML elements as component id:title
2022-06-24 09:21:13
614
原创 解决异步回调地狱的三种方法
2.解决回调地狱的方法2.1 生成器(es6中的语法)生成器是一个特殊的函数(在函数名前面加一个*号),用来解决异步编程的回调地狱问题,语法行为和传统函数完全不同yield语句:函数代码的分隔符,把函数代码切割成几块通过next()来控制代码的一个向下的执行使用iterator 迭代器对象 说明可以使用for of来遍历 每一次调用返回的结果 是yield后面的内容next执行的时候是可以传参的,参数将作为上一个yield语句整体返回结果 看例子:2.2 Promisenew Pro
2022-06-14 15:43:14
2890
原创 element ui 日期选择器 默认展示最近一个月的时间不能选择未来时间
最近用到element ui的日期选择器,把实现过程记录一下。(vue项目)首先说下我的需求:1、默认展示最近一个月的时间2、不可以选择未来时间 效果如下 <template> <div class="block"> <el-date-picker
2022-01-10 18:46:26
6011
原创 使用calc解决css中内容不多,但需要充满整个屏幕的问题
在写样式中,我们经常会遇到页面内容不够多,但需要填充一整个屏幕这种问题,如下图:像图上这种,内容不多,所以无法填充整个屏幕,就很难看,这个时候我们可以使用css3中的一个计算属性calc来实现图上是微信小程序里的。需要使用flex布局 在左半边这块区域 css的样式如下: .left{ height: ~'calc(100vh - 412rpx)';//412rpx是上面的图片加tab切换标签这行的高度,我们用100vh减掉上面的高度,就是下面我们需要填充的高度}这样就解决了 页面不
2021-12-15 17:47:13
1616
原创 在vue中安装postcss-pxtorem报错“ Error: PostCSS plugin postcss-pxtorem requires PostCSS 8.”
今天在vue项目中安装postcss-pxtorem报错“ Error: PostCSS plugin postcss-pxtorem requires PostCSS 8.”看了很多大佬的博客,找到解决办法就是下载指定版本npm i postcss-pxtorem@5.1.1这样就可以了,记录一下
2021-12-08 17:19:29
290
原创 webpack手动配置(二)完结
webpack中的loader1.loader概述在实际开发过程中,webpack默认只能打包处理以 .js后缀结尾的模块,其他非.js的模块webpack默认处理不了,需要调用loader加载器才可以正常打包,否则会报错loader加载器的作用:协助webpack打包处理特定的文件模块。例如:css-loader 打包处理.css相关的文件less-loader可以打包处理 .less相关文件babel-loader可以打包处理webpack无法处理的高级js语法1.1 loader
2021-11-04 10:09:54
124
原创 复习数组中的 some forEach every reduce(重点)方法
1.复习数组的方法需求:拿到数组里的“苏大强”的索引方法一: forEach 弊端:比较消耗性能 它在拿到索引的时候 循环不会停止,return失效 它会把数组里的循环完才结束 const arr =['小红','倪大红','苏大强','苏妲己'] arr.forEach(item,index)=>{ console.log('object') //会打印4次 循环一旦开始,无法在中间被停止 if(item==='苏大强'){
2021-11-04 10:05:46
237
原创 微信小程序rich-text标签遇到的图片和文本的问题
微信小程序rich-text标签遇到的图片和文本的问题(解决rich-text文本里的图片不能正常显示,和文本自带样式的问题)最近在开发小程序,需求就是:编辑器里自带的div、p、span等标签正常的展示在小程序里,然后了解了这个rich-text标签,挺好的,但是我遇到了问题,就是图片不能自适应(图一),文本居然不能自动换行(这个在后台打印出来的原来的span标签自带了样式(图二))因为第一次用rich-text 所以百度了下 用replace来处理,像网上一样的// wxml <ri
2021-09-02 17:14:10
2110
原创 最根本的webpack手动配置(一)
最根本的webpack手动配置(一)序:我们为什么要用webpack?webpack是前端工程化开发的一个具体的解决方案(早期方案:grunt,gulp)parcel也是目前主流的前端工程化解决方案之一在实际的前端开发过程中,每一个开发者都应该遵循四个现代化“模块化,组件化,规范化,自动化”来使自己的代码更清晰规范,在没使用webpack之前,项目中用到的高级语法(例如es6中的)能使开发效率非常高,但浏览器可能不支持不认识这些语法,这个时候我们就需要使用打包工具进行转化解析,处理好各模块间的依赖
2021-08-27 09:40:41
108
原创 Webpack 使用小结
webpack是一款强大的加载器兼打包工具,它能把各种资源,例如JS(包含JSX)、coffee、样式(含less/sass)、图片等都作为模块来使用和处理,优势如下:1.webpack是以commonJS的形式来书写,但对AMD/CMD的支持也很全面,方便旧项目进行代码迁移2.能不能能不能能不能被模块化的不仅仅是js,还包括各种资源文件3.开发便捷,能替代部分gulp的工作,比如打包
2017-11-24 00:28:36
268
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人