问题及解决方法专栏
今天超市大减价
要敢于从0开始,且不止步于1。
展开
-
Vue项目自动注入less、sass、scss、stylus全局变量
【代码】自动注入less(sass、scss、stylus)全局变量。原创 2024-04-09 18:19:38 · 648 阅读 · 0 评论 -
Vue项目打包配置生产环境去掉console.log语句的方法
使用webpack内置的 terser 工具,在vue.config.js文件加上相应的配置即可。同样是使用 terser 工具,不过vite没有内置terser,需要手动安装依赖。安装完后在vite.config.js文件加上相应的配置即可。原创 2024-04-09 17:05:55 · 1478 阅读 · 0 评论 -
vue3项目中导入Excel表格数据
vue3项目中实现导入Excel表格数据原创 2023-08-28 17:22:45 · 780 阅读 · 0 评论 -
CSS媒体查询的用法
媒体查询:根据设备显示器的特性(如视窗宽度、屏幕宽度、设备方向等)来设定不同的CSS样式,媒体查询由媒体类型和一个或多个检测媒体特性的条件表达式组成。原创 2023-08-23 17:31:05 · 2654 阅读 · 0 评论 -
Echarts折线图设置legend图例文本的颜色与对应折线一致
实现:在legend图例文本样式配置中给color设置一个空数组即可。需求:设置legend图例文本的颜色与对应折线一致。记录于2023-7-21。原创 2023-07-21 16:20:46 · 2323 阅读 · 0 评论 -
二维数组/多维数组转一维数组
记录于2023-7-21。1、二维数组转一位数组。2、多维数组转一维数组。原创 2023-07-21 10:26:17 · 1120 阅读 · 0 评论 -
用CSS画三角形
虽然另外三个border不显示,但还是占位的,像上面示例的向下三角形,我们可以把border-bottom的设置去掉,这样border-bottom就不占位了。其他方向的三角形以此类推。3、保留一个三角形,将不需要的border设置成透明的,想要哪个方向的就保留哪个的。4、各个border设置不同的宽度,可以得到不同形状的三角形。实现方法:利用元素的border画出三角形。记录于2023-7-12.原创 2023-07-12 14:46:10 · 104 阅读 · 0 评论 -
CSS设置多行文本溢出显示省略号
记录于2023-3-20。原创 2023-03-20 10:10:19 · 262 阅读 · 1 评论 -
vs code 提交代码弹框提示:请确保已在git中配置您的“user.name”和“user.email” ——解决方法
修改完项目代码,准备提交到git上,结果提交失败,弹框提示:请确保已在Git中配置您的“user.name”和“user.email”原创 2023-02-24 11:31:16 · 16685 阅读 · 0 评论 -
解决HTML代码中的文本换行导致出现字间距空格的问题
解决HTML代码中的文本换行导致出现字间距空格的问题原创 2022-10-20 16:09:31 · 3294 阅读 · 0 评论 -
ElementUI 日期范围选择器设置选择跨度一年、30天、7天
ElementUI 日期范围选择器设置选择跨度一年、30天、7天原创 2022-10-19 09:45:14 · 4840 阅读 · 4 评论 -
uniapp App端 echarts 设置tooltip的formatter不生效问题及解决办法
在App端实现,图表的tooltip提示框中展示数值的单位。原创 2022-09-01 11:39:12 · 9124 阅读 · 7 评论 -
echarts.graphic.LinearGradient 渐变色⽣成器;设置渐变色仪表盘
使用echarts.graphic.LinearGradient 渐变⽣成器设置仪表盘轴线颜色渐变效果: 效果: 完。记录于2022-6-16.原创 2022-06-16 10:59:46 · 9372 阅读 · 3 评论 -
uniapp App端 实现pdf文件预览
一、下载pdf预览需要用到的相关文件(即hybrid文件夹)二、将步骤一下载解压得到的hybrid文件夹放在/src目录下,即 /src/hybrid三、预览pdf1、预览pdf需要用到uniapp的webview组件,所以注册并创建一个专门用于预览pdf的页面,页面使用webview组件。/pages/webview/index.vue:<template> <view style="width: 100%;"> ..原创 2022-05-27 15:11:26 · 22478 阅读 · 32 评论 -
uniapp 添加scss全局变量、scss公共类
一、创建scss变量文件variable.scss和公共类文件common.scss,放在目录/src/static/css/下variable.scss// 主题色$primary-color: #0099FF;// 其他变量......若要添加其他变量直接在文件里加即可。common.scss@import './variable.scss';// 公共类.color-primary { color: $primary-color;}.bg-primary原创 2022-05-18 09:24:34 · 22339 阅读 · 0 评论 -
uniapp 获取屏幕高度
onLoad () { uni.getSystemInfo({ success: (res) => { // 注意这里获得的高度宽度都是px,需要转换rpx console.log(res.screenHeight); // 屏幕高度,包含导航栏 console.log(res.screenWidth); // 屏幕宽度 console.log(res.windowHeight); // 可使用窗口高度,不包...原创 2022-04-25 10:17:52 · 4040 阅读 · 0 评论 -
uniapp App端页面设置背景色无效的问题及解决办法
解决办法一:style去掉scoped// 修改前<style lang="scss" scoped>page { background-color: #f5f5f5;}</style>// 修改后<style lang="scss">page { background-color: #f5f5f5;}</style>解决办法二:为了避免页面的样式影响到其他页面,需要保留scoped。这时可以在另外一个没有scop原创 2022-04-20 17:36:51 · 6173 阅读 · 3 评论 -
echarts设置折线图的symbol标记的颜色
一、在series的itemStyle里配置:series: [ { name: '电流B', data: [15, 8, 23, 17, 18, 20, 22, 16, 18, 12, 24, 20], type: 'line', // 区域面积样式 areaStyle: { color: '#BACDEC' }, // 折线样式 lineStyle: { color: '#C24141' },原创 2022-04-20 14:13:03 · 9981 阅读 · 0 评论 -
解决uniapp App端iconfont图标显示异常问题
原来的iconfont.css:@font-face { font-family: "iconfont"; /* Project id 2762712 */ src: url('iconfont.woff2?t=1631523743638') format('woff2'), url('iconfont.woff?t=1631523743638') format('woff'), url('iconfont.ttf?t=1631523743638') format(原创 2022-04-14 09:14:37 · 2288 阅读 · 2 评论 -
获取上个月,支持跨年
获取上个月,支持跨年// 获取上个月import { moment } from '@/filters/moment'const now = new Date()const prevMonth = moment(now.setMonth(now.getMonth() - 1), 'YYYY-MM')console.log(prevMonth)如果当月是2022-04,则prevMonth为2022-03;如果当月是2022-01,则prevMonth为2021-12。以此类原创 2022-04-06 11:35:41 · 897 阅读 · 0 评论 -
英文网址在div容器不换行,溢出的问题
解决方法:给div设置css属性:word-break: break-all; 如下:<div> <div class="website" style="width:300px;"> https://https://mp.csdn.net/mp_blog/creation/editor?spm=1001.2014.3001.5352 </div></div><style>.website { word-br原创 2022-03-31 09:57:31 · 213 阅读 · 0 评论 -
js实现web端监听页面滚动切换当前tab
开发背景:Vue项目实现代码: mounted () { window.addEventListener('scroll', (event) => { // console.log(216, event.target.documentElement.scrollTop) const headerHeight = document.querySelector('.page-header').clientHeight const a = docu原创 2022-03-02 10:44:20 · 782 阅读 · 0 评论 -
js实现web端锚点定位
一、代码实现 // domId为需要定位的元素id changeTab (domId) { // const id = decodeURIComponent(`#${domId}`) // const el = document.querySelector(id) const el = document.getElementById(domId) // 上面这种方法获取el也可以 const rect = el.getBoundingCl原创 2022-03-02 10:38:24 · 433 阅读 · 0 评论 -
用flex布局左右布局时,左边菜单栏position: sticky不生效
解决办法:加上 align-self: flex-start原因:由于是flex布局,左边菜单栏的高度变得和右边的一样,且高于屏幕高度。.nav-menu { align-self: flex-start; position: sticky; top: 64px; display: flex; flex-direction: column;}记录于2022-3-2...原创 2022-03-02 10:02:59 · 1837 阅读 · 3 评论 -
js实现搜索关键字高亮
开发背景:vue项目实现代码:// 关键字变红function keywordRed (keyword) { if (keyword && keyword !== '') { const nodesObj = document.getElementsByClassName('item-title') const nodes = Object.values(nodesObj) nodes.forEach(item => { cons原创 2022-03-01 19:28:42 · 6187 阅读 · 3 评论 -
Vue项目实现web端第三方分享(qq、qq空间、微博、微信)
开发背景:文章详情页面需要分享到第三方,包括qq、qq空间、微博、微信。一、封装一个share.js文件,放在目录/utils下// share.js// url - 需要分享的页面地址(当前页面地址)// title - 分享的标题(文章标题)export function toQQzone (url, title) { url = encodeURIComponent(url) title = encodeURIComponent(title) window.open(`原创 2022-02-25 17:12:13 · 2845 阅读 · 6 评论 -
js实现字体大小设置
1、实现代码:// el - 要设置字体的最外层元素,size - 字体大小,单位pxfunction setFontSize (el, size) { // 获取元素el下的所有元素nodes const nodesObj = el.getElementsByTagName("*") const nodes = Object.values(nodesObj) nodes.forEach(node => { node.style.fontSize = size + "p原创 2022-02-25 16:51:30 · 5247 阅读 · 0 评论 -
Vue项目实现web端打印页面
一、封装一个print.js文件,放在目录/utils下// print.jsexport function clear () { const iframes = document.body.querySelectorAll('iframe.print-iframe') iframes.forEach(iframe => { document.body.removeChild(iframe) })}export function print (el) { //原创 2022-02-25 16:41:31 · 493 阅读 · 0 评论 -
原生js给DOM元素添加、删除类名
方法一:DOM.className = '类名';说明:一次只能设置一个类值,如果当前属性本身存在类值,会被替换。方法二:DOM.setAttribute("class", "类名")DOM.removeAttribute("class", "类名")说明:setAttribute用于创建或改变某个新属性,如果指定属性已经存在,则只设置该值并且会替换原来的值。方法二:DOM.classList.add('类名一', '类名二', '类名三); // 添加一个或多个类名原创 2022-02-25 16:10:52 · 13072 阅读 · 0 评论 -
如何遍历多级树状数据查找某个节点
实现代码:// data是根节点对象,对象有children数组,children里的节点可能还有更多级的childrenconst findData = (targetId, data) => { if (data.id === targetId) return data if (Array.isArray(data.children)) { for (let i = 0, l = data.children.length; i < l; i++) { le原创 2022-02-17 15:38:39 · 528 阅读 · 0 评论 -
实现canvas中的文本水平居中、垂直居中
环境:uniapp项目一、view视图<canvas style="width: 400px; height: 40px;" canvas-id="myCanvas" id="myCanvas"></canvas>二、js代码 onReady(e) { var ctx = uni.createCanvasContext('myCanvas') ctx.font="16px Arial"; ctx.textAlign = "center"原创 2022-01-10 16:19:15 · 6644 阅读 · 0 评论 -
字符串、16进制字符串、ArrayBuffer之间的一些转换
背景:有个蓝牙相关的小程序项目,需要向蓝牙设备写入数据,用到相关的知识,记录一下。一、字符串转16进制字符串 // 字符串转16进制字符串 string2Hex(str) { let val = "" for (let i = 0; i < str.length; i++) { if (val == "") val = str.charCodeAt(i).toString(16) else原创 2022-01-05 12:29:49 · 6377 阅读 · 0 评论 -
时间戳转成16进制字符串,16进制字符串转成时间戳
一、时间戳转成16进制字符串JavaScript toString() 方法:把一个 Number 对象转换为一个字符串,并返回结果。语法:NumberObject.toString(radix)radix - 表示数字的基数,是 2 ~ 36 之间的整数。若省略该参数,则使用基数 10。返回值:数字的字符串表示。例如,当 radix 为 2 时,NumberObject 会被转换为二进制值表示的字符串。注意:当调用该方法的对象不是 Number 时抛出 TypeError 异常。原创 2021-12-30 14:31:43 · 8472 阅读 · 0 评论 -
uniapp前端生成图形验证码并校验
一、uniapp前端生成图形验证码并校验1、在src/utils目录下新建文件mcaptcha.js// mcaptcha.jsexport class Mcaptcha { constructor(options) { this.options = options; this.fontSize = options.height * 3 / 6; this.init(); this.refresh(); } init() { this.ctx原创 2021-12-20 16:12:11 · 9396 阅读 · 28 评论 -
前端请求接口传递数组参数
1. 将数组转为JSON字符串再传参:export function addEntityKnowledge(enterpriseId, paramsList) { return request({ url: '/matters/match', method: 'POST', data: { enterpriseId, paramsList: JSON.stringify(paramsList) } })}记录于2021-12-1原创 2021-12-17 14:25:40 · 2863 阅读 · 0 评论 -
js获取某个字符的ASCII码、获取字符串中某个字符的ASCII码
1、String.charCodeAt(index)用法:返回指定位置的字符的 Unicode 编码,返回值是 0 - 65535 之间的整数,表示给定索引处的 UTF-16 代码单元。index -表示字符在字符串中的位置。示例:var str = "abc";var m = str.charCodeAt(1); // 'b'console.log(m) // 98// 单个字符同样适用var str2 = "a";var n = str2.charCodeAt(0);.原创 2021-11-23 16:55:37 · 12963 阅读 · 0 评论 -
uniapp App跳转微信小程序并互相传递参数、接收微信小程序传递的参数
本文是打包成安卓App。一、注意事项用到了分享功能,在打包原生应用时,需要注意:首先勾选权限配置,manifest.json->App 模块权限配置->Share。然后,manifest.json->App SDK 配置->分享,按照提示填写微信分享的信息(微信开放平台,不是微信公众平台)。因为涉及到第三方 SDK 的配置,需要打包自定义基座进行测试。需要在微信开放平台开启APP跳转小程序,并管理相应的小程序微信开放平台 -> 移动应用 -> 查看 ->原创 2021-11-11 10:25:00 · 10636 阅读 · 8 评论 -
获取微信开放平台申请移动应用时的应用签名和应用包名
一、背景uniapp开发App端需要实现微信登录、分享等功能,需到微信开放平台申请移动应用。填写申请信息需要填写Android的应用签名和应用包名。本文讲述如何获取应用签名和应用包名。原创 2021-11-10 17:34:53 · 9170 阅读 · 6 评论 -
uniapp项目 App端实现微信登录、QQ登录
本文是基于打包成安卓App的前提。一、注意事项1、HBuilderX配置manifest.json,如下图:其中,微信登录填写的appid、appsecret需要到微信开放平台(微信开放平台)申请创建移动应用(见此文:微信开放平台申请移动应用),审核通过即可获取appid和appsecret。QQ登录填写的appid需要到腾讯开放平台(腾讯开放平台 OPEN.QQ.COM)申请创建移动应用,审核通过即可获取appid。两者的IOS平台通用链接点击自动生成按提示生成即可。2、打包.原创 2021-11-10 17:18:01 · 5829 阅读 · 0 评论 -
uni-app页面mask遮罩层弹窗禁止页面滚动
实现:在遮罩层所在的view加上属性catchtouchmove="true"代码:<view class="dy-mask" catchtouchmove="true"> <view class="dy-popup"> <view class="fz-28 color-33 line-1">点击可以收藏关注</view> <view class="fz-28 color-0F4C8E line-1">我知道了<原创 2021-10-13 17:00:35 · 2166 阅读 · 1 评论