LLL_LH-CSDN博客

原创 vscode插件开发-打包umijs框架react项目

问题：需要把一个Umijs框架开发的react项目打包，然后运行到vscode插件项目里，但是vscode插件运行需要把项目打包成一个css、一个js,如果有多个css、js,vscode插件运行就会报错。3、但是加了这个运行dev,页面就会报错，而且vscode插件运行的数据请求不能使用nginx代理，要用绝对路径请求，所以我们需要依赖注入加判断。2、在.umirc.ts文件注入，不需要引入,这个插件可以帮助导出后只有一个css、js。6、给所有请求添加前缀，在请求拦截器里面进行判断添加。

2024-07-26 11:05:20 423

原创 vue3全局配置截取方法-slice

vue3全局配置截取方法

2022-04-29 10:20:30 893

原创 antd-pro的table搜索表格标签没显示完全

<ProTable columns={columns} dataSource={dataSource} rowKey="key" search={{ span: 6, autoComplete: "off", labelWidth: 100 }} dateFormatter="string" />设置labelWidth..

2021-11-03 14:50:33 992 1

原创 React 中保存页面状态，在react中实现vue的keep-alive，React Activation

今天有个业务需求，在列表页筛选查询条件后，进入详情页，返回列表页时，筛选条件还存在。选中了React Activation插件，使用如下：这是参考文档：react-activation/README_CN.md at d08219cba1fd3bc2ddd18b382eac656f1826d65d · CJY0208/react-activation · GitHub1、安装yarn add react-activation2、在App.js页面引入AliveScopeimpor

2021-08-09 11:32:59 1749

原创 axios请求下载excel文档blob异常处理不显示

问题:数据请求加了{responseType:"blob" },那么返回的数据格式就是blob格式,这时候如果有错误提示,返回的也是blob格式,而不是我们想要的错误提示,如果没加{responseType:"blob" },那么错误提示可以正常提示.下面是正常错误提示,没加{responseType:"blob" },这是导出,加了{responseType:"blob" },这时候就没有错误提示,前端就不能做统一处理解决办法:把导出接口请求两次,第...

2021-08-06 09:56:47 1198

原创微信小程序全局主题颜色设置

1、app.wxsspage{ font-size: 32rpx; background-color: #F2F2F2; color: #333; width: 100vw; height: 100vh; --themeColor:#B01717; // 样式变量}2、在其他页面使用color: var(--themeColor);

2021-07-08 16:10:55 2832

原创微信小程序设置背景渐变

.bg{ background: linear-gradient(#3E54D7, #4360E2,#4F76FF); }

2021-05-27 16:05:28 950

原创 echarts的dataZoom里的endValue设置固定长度

写了一个折线图，但是数据太多，所以加了dataZoom,之后又要一个页面显示固定长度，所以endValue要加限制。官方文档：https://echarts.apache.org/zh/option.html#dataZoom-inside.endValue放代码：setChartOptions (charts) { option = { tooltip: { show: true, trigger: 'axis', conf

2021-03-25 10:34:47 2361

原创微信小程序版本更新

文档：https://developers.weixin.qq.com/miniprogram/dev/api/base/update/wx.getUpdateManager.htmlif (wx.canIUse('getUpdateManager')) { const updateManager = wx.getUpdateManager() updateManager.onCheckForUpdate(function (res) { if (res.ha.

2021-03-10 09:38:44 296

原创微信小程序浏览线上文档

微信小程序文档：https://developers.weixin.qq.com/miniprogram/dev/api/file/wx.openDocument.htmlwx.downloadFile({ url: 'http://list.xls', success: (res) => { wx.openDocument({ filePath: res.tempFilePath, success: functi.

2021-03-05 10:01:43 1042 1

原创微信小程序动态添加class,事件传参

data-参数名="值"bind:tap="事件名称"<view class="tab-item {{tabIndex=='1' ? 'active' : ''}}" data-tab="1" bind:tap="tabChange">点击</view>tabChange(event){ console.log('tabChange', event) let tabIndex = event.currentTarget.dataset.tab; .

2021-01-25 15:13:24 941

原创微信小程序使用weui组件

微信新版本通过useExtendedLib引入即可，不用使用npm构建1、引入weui在app.json页面，设置"weui":true{ "pages": [ "pages/index/index", "pages/login/index" ], "window": { "backgroundTextStyle": "light", "navigationBarBackgroundColor": "#fff", "navigation...

2021-01-18 11:36:19 619

原创 uniapp小程序分包加载优化，图片分包记录

因为小程序的大小有限制，单包不能超过2M,整包不能超过16M，如果小程序太大，不做分包处理的话就无法上传成功。1、页面分包详情查看https://uniapp.dcloud.io/collocation/pages?id=subpackages如果分包的自定义组件只有分包里面才使用，那么这个组件文件夹可以放到分包里面，这样打包的时候就不会分包到主包里。tabBar的页面必须放在主包里。2、根据目录再pages.json 注意：写在subPackages里面的pag...

2020-12-14 10:59:51 5604 12

原创 ucharts 当数据最大值较小的时候，Y轴会出现小数点

ucharts 图表使用的时候如果传过来的最大值调小，Y轴就会出现下面的问题，这样肯定是不好的，解决如下:获取series传值里面的最大值，动态设置Y轴的splitNumber: this.num,getNum() { let maxArr = this.dataEcharts[this.valueKey][0].data; let num = ''; let newArr = maxArr.map(Number); // 字符串数组转为整数数组 let max = .

2020-12-08 11:21:08 4752 1

原创微信小程序动态设置页面标题

小程序文档小程序提供了接口，直接调用设置即可wx.setNavigationBarTitle({ title: '当前页面'})

2020-11-13 10:37:37 206

原创 uniapp地图自定义组件拖拽获取中心经纬度

@regionchange="regionchange" ：地图滑动调用的方法<map id="maps" class="map" :longitude="longitude" :latitude="latitude" :markers="markers" :polyline="polyline" :include-points="points" @tap="mapTap" @regionchange="regionchange"></map>regioncha.

2020-11-11 14:19:23 2901 3

原创 vue html页面导出pdf

1、下载html2canvas、JsPDF// 将页面html转换成图片npm install html2canvas --save// 将图片生成pdfnpm install jspdf --save2、点击导出，导出内容<template> <div class="credit-result" ref="result"> <div class="drawer-contenr" v-if="query.type

2020-10-30 10:51:32 658 1

原创 js 实现数组取差集

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <input type="text" value="" oninput="change" /> <script> let a = [1,2,3,4]; let b = [1,4,5,6,7.

2020-10-30 10:06:01 872

原创 uniapp使用luch-request

官网：https://www.quanzhan.co/luch-request/1、下载luch-request插件，将插件放在common目录里2、在根目录下的common目录里创建http目录，新建index.js3、commom/http/index.jsimport Request from '@/common/luch-request/index.js'const http = new Request();import {baseUrl} from './baseUrl.js

2020-10-13 16:48:13 2419 5

原创 uniapp页面传参带有特殊符号，使用encodeURIComponent转义

encodeURIComponent进行编码let str = 'kohePOtjXz3AVIo==';uni.navigateTo({ url: `../list/list?antiFakeCode=${encodeURIComponent(this.antiFakeCode)}` })解码时用decodeURIComponent进行解码onLoad(options) { console.log('options', options) this.antiFake.

2020-09-21 19:58:08 8411 1

原创 splice删除数组中的指定的某些元素

splice删除我们常见的是如下，我们要删除addr数组中，包含属性a为空的元素for(let i=0;i<==arrd.length-1;i++){ if(addr[i].a==''){ addr.splice(i, 1) }}但是这样是不能删除数组中所有a属性为空的数组的，因为splice会改变原数组，会导致i的变化，所以我们可以使i一直等于数组的长度-1for(let i<=arrd.length-1;i>=0;i--){ if(addr[i].a==''

2020-09-10 09:22:58 4190

原创 uni-app中scroll-view的高度

需要做一个点击弹出列表的模态框，这个列表可以下拉滑动1、代码<view @tap="showModal=true">{{form.organizationName}}</view><view class="moddal" v-if="showModal" @tap="showModal=false"> <view class="moddal-content"> <scroll-view :scroll-top="sc

2020-09-04 17:56:36 5343

原创 uniapp保存base64二维码图片到相册

qrcode路径返回的base64码显示图片：<image :src="'data:image/jpg;base64,' + qcCode"></image><button type="primary" class="saveBtn" @tap="getSaveImg(qcCode)">保存二维码至相册</button>保存二维码至相册，先判断用户是否授权，如果用户已经授权则直接保存。uni.getFileSystemManager()

2020-08-24 11:49:35 5434 7

原创 uniapp显示base64图片

<image :src="'data:image/jpg;base64,' + qcCode"></image>如果图片还是不能显示，有可能base64代码换行，要去除换行qcCode =qcCode.replace(/[\r\n]/g, "");

2020-08-21 10:06:19 9282 4

原创 Vue线上使用cdn加速

1、public/index.html<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> &l

2020-08-08 14:55:36 981

原创 elementui的table列超出隐藏tooltip悬浮显示

<el-table-column label="内容" show-overflow-tooltip> <template slot-scope="scope"> {{scope.row.desc}} </template></el-table-column>当表格中的某些内容过长会导致表格变形，所以可以只显示一行，超出的部分隐藏，鼠标滑过时显示所有内容，如上所示，添加show-overflow-tooltip属性。注意：显示.

2020-08-05 14:33:24 6915 2

原创 uniapp中的picker为对象数组，range，range-key设置了，显示出的值为[obiect object]

问题：代码如下：<evan-form-item label="与户主关系"> <picker class="form-item-picker" @change="relationshipChange" :range="relationshipData" :value="relationship" :range-key="name"> <!-- @change用于获取弹出框改变的值，:range用于循环遍历relationshipData数组将数组内容循环

2020-08-04 16:13:36 5577 4

原创微信小程序预览和真机调试结果不一样

微信小程序在开发者工具和真机预览上都可以得到想要的结果，但是预览就不行，这是因为在开发者工具中设置了 “不校验合法域名...”,而真机调式时，手机端也是默认不校验合法域名的，而预览的时候默认是开启域名校验的，所以在预览扫描二维码后，点击右上角的三个点“...”按钮，点击开发调式，开启调试，再次扫描二维码，就可以得到和真机预览一样的效果了...

2020-07-31 12:30:30 9241 6

原创 create-react-app创建项目报错

create-react-app my-app创建项目时报如下错误C:\kc\hb\react>npx create-react-app my-appnpx: installed 98 in 7.775sCreating a new React app in C:\kc\hb\react\my-app.Installing packages. This might take a couple of minutes.Installing react, react-dom, and rea

2020-07-14 11:18:39 1250

原创高德地图label换行

换行加一个 " \n "就可以了markers[{...label: { content: '象鼻镇岷江村第一网格\n201号', fontSize: 13.33, borderRadius: 6.67, bgColor: '#2A98FF', padding: 17, textAlign: 'center', color: '#FFFFFF' }}...

2020-07-01 11:14:27 1306 3

原创 uniapp实现拨打电话

<view @click="callPhone('11234')">联系我们： 11234</view>methods: {// 拨打电话 callPhone(tel){ uni.makePhoneCall({ phoneNumber: tel }) },}uni.makePhoneCall(object)参数名类型必填说明 phoneNumber String 是需要拨打的电话号码 succe.

2020-06-12 15:12:31 9501 2

原创 uniapp事件传递参数，获取事件对象

<button @click="handleClick(1, $event)">点击</button>methods: { handleClick: function(id,e) { console.log(id); // 1 console.log(e); // 事件对象 },}

2020-06-10 17:57:28 4248

原创 uniapp忽略提交unpackae

1、新建.gitignorenode_modules/.projectunpackage/.DS_Store如果之前已经提交过unpackae，执行如下命令git rm -r --cached unpackage

2020-06-05 10:34:17 1104

原创 uniapp的:class三元表达式写法

2020-06-04 10:59:55 5619

原创 uniapp小程序使用iconfont彩色图标

1、进入阿里巴巴矢量图标库https://www.iconfont.cn/，添加图标到项目，然后下载至本地解压后的本地文件如下2、下载iconfont-toolsnpm install -g iconfont-tools进入解压后的文件夹，如上图所示目录，命令行运行iconfont-tools然后一直enter,然后就会多出来一个iconfont-weapp的文件夹进入文件夹,将其中的iconfont-weapp-icon.css放入static目录下，然后在Ap

2020-06-03 14:47:34 3675 9

原创 simple uploader 对上传文件校验

simpleuploader的具体方法使用方法看官方文档，这里记录一下对上传的文件的校验<uploader :options="options" :file-status-text="statusText" class="uploader-example" ref="uploader" @file-added="onFileAdded" @complete=

2020-05-22 11:44:45 1433 1

原创 elementui上传组件时，想要传递其他参数

<el-upload :action="docUrl" :show-file-list="false" :before-upload="(file)=>beforeFileUpload(file,id)" :on-success="handleDocSuccess"> <el-button size="small" type="primary" @click="n = index;">点击上传</el-but.

2020-05-22 10:25:09 1398 1

原创 elementui实现自定义主题色

1、在assets文件夹下新建element-variables.scss文件/* 主题色 */$--color-primary: #f60;/* 改变 icon 字体路径变量，必需 */$--font-path: '~element-ui/lib/theme-chalk/fonts';@import "~element-ui/packages/theme-chalk/src/in...

2020-05-08 14:13:03 612

原创 vue3打包去除console.log

vue.config.jsconfigureWebpack: config => { if (process.env.NODE_ENV === 'production') { config.optimization.minimizer[0].options.terserOptions.compress.drop_console = true } },...

2020-05-07 17:28:50 943