- 博客(76)
- 收藏
- 关注
RSS订阅原创 antd中Transfer穿梭框数据显示问题
新接手的react项目中，有需求要在结构中渲染多个穿梭框，实际表现是框出来了，只有第一个穿梭框中的数据正常显示，如下图数据都是有的，就是不显示出来，勾选上就会展示，或者不使用map循环渲染的方式直接多个列出来也会正常展示。原因：Transfer 默认使用了 react-lazy-load 优化性能，可以通过设置 lazy={false} 关闭懒加载。...
2021-07-08 09:45:53
4177
原创 项目内调用手机地图应用
//地图路径规划经纬度城市名称exportdefaultfunctionopenMapRoute(lat,lon,cityName){varurl='';if(plus.os.name=='Android'){varhasBaiduMap=plus.runtime.isApplicationExist({pname:'com.baidu.BaiduMap',act...
2021-05-17 15:04:51
348
1
原创 pc端调用电脑摄像头及麦克风完成录像或录音并实现回放和上传服务器
首先定义获取媒体设备的方法var MediaUtils = { /** * 获取用户媒体设备(处理兼容的问题) * @param videoEnable {boolean} - 是否启用摄像头 * @param audioEnable {boolean} - 是否启用麦克风 * @param callback {Function} - 处理回调 */ getUserMedia: function (videoEnable, audioEnable, callbac
2021-05-08 16:43:48
1638
3
原创 websock的使用
let websock;function websocketonopen (userId) { //连接建立之后执行send方法发送数据 let actions = { "userId": userId }; if (websock.readyState==1){ websocketsend(JSON.stringify(actions)) }}function websocketonerror(){//连接建立失败重连 initWebSocket().
2021-05-08 15:39:05
528
原创 在vue项目中单独引入某一elementui组件
1.安装element-ui库npm i element-ui -S2.在启动文件中配置import{DatePicker}from'element-ui';import'element-ui/lib/theme-chalk/index.css';Vue.use(DatePicker);3.在页面中使用<el-date-pickerv-model="value1"type="daterange"...
2021-04-25 10:12:42
5373
原创 隐藏electron窗体菜单栏的几种方式
方法1：const electron = require('electron')const Menu = electron.Menufunction createWindow (){Menu.setApplicationMenu(null)}方法2：newBrowserWindow（{autoHideMenuBar： true}）方法3：newBrowserWindow（{frame:false}）...
2021-04-22 15:51:51
4535
原创 使用swiper实现视频和图片混合轮播
完成需求：轮播页面自动滚动循环播放素材，在视频页面自动播放视频至视频结束后继续轮播下一个素材，手动切换时视频页暂停播放，切换回来后恢复播放。1.安装swiper相关插件2.在轮播页面引入import{Swiper,SwiperSlide}from"vue-awesome-swiper";import"swiper/swiper-bundle.css";importSwiper2,{ Autoplay}from"swiper";Swiper2.use([Na...
2021-04-22 11:38:58
7126
6
原创 vue中监听用户操作，无响应状态返回首页
在根页面的最外层节点上添加点击事件： <div id="app" @click="clickApp" > <router-view /> </div>设置未响应时长data() { return { clickTime: new Date(),// 最新点击时间 responseTime: 300000, // 5分钟不响应自动跳转首页 timeout: null,// 点击后的定
2021-04-22 11:23:01
652
1
原创 uni-app项目配置UrlSchemes在外部打开APP
已经安装跳转应用的情况1.对于IOS配置打包配置路径manifest->app-plus->distribute->ios注意不要使用大写及中文以及特殊字符等，示例代码如下"urltypes" : [ { "urlidentifier" : "com.runtest.test", "urlschemes" : [ "runtest" ]
2021-03-30 15:14:30
10840
3
原创 uniapp中地图使用注意事项
1. 地图中添加cover-view时，一定要设置高度，否则map在苹果手机端会无法移动和缩放2.cover-view中添加scroll-view需要用一个父元素包起来，否则在添加数据后，在ios端可能会出现高度不生效的问题3. 绘制markers时务必要先勇一个中间变量存起来后再一次性赋值给markers，不能直接操作markers，路线绘制同理...
2021-03-25 13:05:39
2393
原创 uniapp资源在线升级/热更新,整包热更新
先介绍整包更新：一般iOS Appstore的安装包，无法直接更新。App启动后检查有新版本，只能调整到Appstore，然后用户在Appstore的详情页点击更新按钮。而Android App，可以直接下载新的apk，只要包名和证书不变，就可以覆盖安装。首先在app启动入口检测是否需要更新：uni.request({ url: 'you url', //仅为示例，并非真实接口地址。 method: 'GET', success: res => { cons
2021-03-11 17:44:50
1461
原创 计算当天、本周、本月、本季、今年的起止日期
// 日期格式化Date.prototype.format = function(format) { var o = { 'M+': this.getMonth() + 1, // month 'd+': this.getDate(), // day 'h+': this.getHours(), // hour 'm+': this.getMinutes(), // minute 's+': this.getSeconds(), // second 'q+': Math.flo.
2021-03-01 17:47:31
295
原创 获取距离指定日期的指定间隔的日期
// asi指定的间隔，defaultD指定的日期，type往前还是往后getAppointDate(asi, defaultD, type) { let n = asi; let d = new Date(defaultD); let year = d.getFullYear(); let mon = d.getMonth() + 1; let day = d.getDate(); if (day <= n) { if (mon >.
2021-03-01 17:46:00
200
原创 echarts创建立体柱状图（堆叠或单独），面积折线图渐变配置项参考
参考效果如图配置项中需要注意的几个要点：1. 颜色取值需要有范围，以突出立体感2. 对于需要堆叠的数据，设置相同stack3. 对于pictorialBar类型的图，数据大小和图形显示位置通过data和symbolPosition: 'end'，symbolOffset: [0, '50%'],symbolSize: [barWidth, 10]进行调整4.symbol: 'diamond'展示的是菱形图形，其他类型的可以参考官网配置项示例代码如下：const color.
2021-03-01 17:27:33
3252
原创 echarts使用过程中遇到的小问题汇总
1. 饼图位置确定不能由grid来设置，需要使用center和radius要设置；2. legend过长超出范围时设置显示方式:方式1：官网给出的方案：label{overflow:"none"}文字超出宽度是否截断或者换行。配置width时有效'truncate'截断，并在末尾显示ellipsis配置的文本，默认为... 'break'换行 'breakAll'换行，跟'break'不同的是，在英语等拉丁文中，'breakAll'还会强制单词内换行 (但是我的玫瑰图配置后无...
2021-02-24 09:53:05
7244
2
原创 判断数组的方法差异（web，安卓，ios）
测试数据var arr = ["http://mddoss.dev.gzqylc.com//oss/file/2020/11/18/9C39C6889B559FC756A92EE240A53B9D.mp4", "http://mddoss.dev.gzqylc.com//oss/file/2020/11/18/EFB7A11FD842DAFBE2277FFE558EB107.jpeg"]; console.log(Object.prototype.toString.call(arr) =
2020-11-18 16:59:25
215
原创 uniapp中在线预览（打开）文件
基于官方openDocument方法。同保存图片至本地相同，该方法路径参数不支持网络路径，因此需要使用downloadFile后获取一个临时路径loadFile(url) { uni.downloadFile({ url: url, success: (res) => { if (res.statusCode === 200) { uni.openDocument({ filePath: res.tempFilePath,
2020-11-17 14:59:10
17040
原创 uniapp中图片下载到相册的功能
基于方法saveImageToPhotosAlbum官方文档中介绍到，参数filePath可以是临时文件路径也可以是永久文件路径，不支持网络图片路径。那么如何将app中后台返回的图片（服务器地址）下载到手机相册中呢？可以先使用downloadFile方法，下载成功后成功的回调函数中会返回一个临时路径，再将此路径给上一个SDK即可；完整代码参考：loadImage(url) { uni.showLoading({ mask: true, title: "图片保存中
2020-11-17 14:26:37
1665
原创 uniapp中自定义tabbar
本次自动以tabbar在插件库sdk基础上完成，感谢巨人的肩膀。另外uniapp官方正在于此功能进行投票，后期可能官方就可以支持该功能啦~插件地址：https://ext.dcloud.net.cn/plugin?id=1425实现步骤：1.在插件商店中导入插件至所需要的项目中，2.page.json中设置正常tabbar展示的数组列表3.在登录页面权限判断看是否展示自定义tabbar:uni.setStorageSync('isExternal', res.data.isExte
2020-11-13 16:07:56
3169
原创 uniapp中强制横屏、竖屏
plus.screen.lockOrientation('portrait-primary');竖屏plus.screen.lockOrientation('landscape-primary');横屏
2020-11-13 15:45:19
4950
原创 uniapp中使用echart，单个或者多个，封装组件后echart图表不刷新
此文以饼图数据为例：对于单个图标渲染，只需要在结构和js中插入以下代码即可<view @click="echarts.onClick" :prop="option" :change:prop="echarts.updateEcharts" id="echarts" class="echarts-pie"></view>设置变量：option: { graphic: [{ //环形图中间添加文字 ...
2020-11-05 22:22:48
1911
3
原创 uniapp中弹起软键盘的相关设置，ios中软键盘弹起不兼容的混合写法
1.首先需要在page.json中设置软键盘弹起的相关属性{"path": "your page link", "style": { "app-plus": { "softinputMode": "adjustResize", // 自适应软键盘弹起页面高度 "softinputNavBar": "none" // 取消ios中软键盘上方完成按钮等 } }}2.页面中动态设置需要滚动的元素高度// 键盘获取焦点事件：inputFocus(e) { let sys
2020-11-02 19:23:04
5328
4
原创 uniapp中获取上一页内容
let pages = getCurrentPages();let page = pages[pages.length - 2];page.refreshflag = true;(此参数为上一页中的参数)
2020-09-15 10:11:04
3608
转载 vue 优化小技巧 之 require.context()
1、require.context()回忆一下当我们引入组件时第一步 创建一个子组件第二步 import ... form ... 第三步components:{..} 第四步页面使用 <...></...>代码实现: 目录结构:components / context / subset页面效果以上一共五个子组件大量重复的代码<template> <div> ...
2020-07-28 15:44:59
610
原创 条件注释判断浏览器版本
<!--[if !IE]><!--> 除IE外都可识别 <!--<![endif]--><!--[if IE]> 所有的IE可识别 <![endif]--><!--[if IE 6]> 仅IE6可识别 <![endif]--><!--[if lt IE 6]> IE6以及IE6以下版本可识别 <![endif]--><!--[if gte IE 6]> IE6以及IE6以上版
2020-06-02 17:23:03
133
原创 重写input输入框样式
outline-style:none; // 取消点击时外边框border:none; // 取消边框，可自己重写border属性text-indent:1em; // 设置内部缩进重写input提示词样式input::-webkit-input-placeholder{color:#999;}...
2020-05-12 09:35:09
836
转载 去除inline-block元素间间距的几种办法
真正意义上的inline-block水平呈现的元素间，换行显示或空格分隔的情况下会有间距，很简单的个例子：<input /> <input type="submit" />我们使用CSS更改非inline-block水平元素为inline-block水平，也会有该问题：.space a { display: inline-block; p...
2020-04-30 17:06:04
328
原创 css设置文字渐变色
font-weight: bold; background-image:-webkit-linear-gradient(bottom,#5592ad,#59a0a0,#60b68b); -webkit-background-clip:text; -webkit-text-fill-color:transparent; bottom表示为从下至上的颜色...
2020-04-30 16:56:45
483
原创 js或jq中返回上一页
history.back(-1):直接返回当前页的上一页道，数据全专部消息，是个新页面history.go(-1):也是返回当前页的上一页，不过表单里的数据全部还在
2020-04-27 14:22:54
766
原创 重写浏览器默认滚动条样式
/*滚动条样式 innerbox为需要滚动的区域盒子*/ .innerbox::-webkit-scrollbar {/*滚动条整体样式*/ width: 4px; /*高宽分别对应横竖滚动条的尺寸*/ height: 4px; } .innerbox::-webkit-scrollbar-t...
2020-04-09 10:36:18
773
原创 css中一行展示不完整省略号显示与一段展示省略号显示
单独一行超出省略号显示text-overflow:ellipsis;overflow:hidden;white-space:nowrap;段落超出指定行数省略号显示 display: -webkit-box; -webkit-box-orient: vertical; -webkit-line...
2020-04-08 10:25:35
1091
原创 项目中vscode使用less自动编译为css
1.首先要在全局安装lessnpm install less -g2.然后下载easy less插件3.在项目根目录下创建.vscode文件夹，并在其中创建settings.json文件4.在新创建的配置文件中输入以下信息：{ "less.compile": { "out": "${workspaceRoot}\\css\\" }}...
2020-02-24 15:34:32
2171
7
原创 ant design vue中日期选择框混合时间选择器的用法
首先时间格式化用到moment方法，需要在页面中引入moment组件importmomentfrom'moment'结构代码：<a-date-picker style="width:100%" :getCalendarContainer="(triggerNode) => triggerNode...
2019-12-05 10:27:00
12474
8
原创 ant design vue表单中自定义检验规则，如手机号码
<a-form-item label="手机号码" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }" > <a-input v-de...
2019-10-17 11:28:04
6994
2
原创 vue中使用jsplumb基本教程
jsplumb中文教程地址：https://wdd.js.org/jsplumb-chinese-tutorial/#/需求效果展示：说明：在展示普通流程图的基础上，实现以下功能：在流程图中展示当前所在节点，并体现出其流转过程。上图中当前节点为分公司咨询组，流转过程为：派单->省公司虚拟专家组->分公司咨询组安装依赖包：npm i jsplumb在main.js中...
2019-09-26 11:43:47
22072
3
原创 ant design vue中嵌套表格以及表格内部编辑的用法
实现效果：因为pro手脚架中封装的s-table不支持expand和expandedRowsChange事件，无法实现根据展开节点获取其内部数据的需求，因此直接使用a-table组件表格外层可以翻页，查询携带页码参数<a-table size="default" rowKey="dict_id" //根据自己数据内部关键针设定 ref="...
2019-09-04 16:45:35
27912
6
原创 ant design vue中treeselect异步获取数据
结构：<a-tree-select :dropdownStyle="{ maxHeight: '400px', overflow: 'auto' }" :getPopupContainer="(triggerNode) => triggerNode.parentNode" :loadD...
2019-07-29 16:28:56
11195
15
原创 ant design vue中树形控件defaultExpandAll设置无效
页面步骤：1.设置a-tree标签2.默认的treeNodes值设置为空数组3.在mounted组件加载的时候给treeNodes的值赋值结果：设置defaultExpandAll无效，并不能展开所有节点原因：defaultExpandAll 仅在组件第一次渲染时有效，不仅仅tree组件，其它组件的defaultXXX值都是这个行为，可以自行搜索受控组件/非受控组件的概念...
2019-06-24 16:12:24
20104
10
原创 使用express搭建服务器访问vuecli3页面中遇到的问题
1.指定服务器地址：在vue.config.js中配置,可以在前端文件中访问后台资源devServer: {proxy: 'http://localhost:3000'},2.打包完成后需要将dist放在根目录，设置静态文件夹app.use(express.static('./dist'));3.无法正常在url中输入路径使用路由跳转前端页面：安装connect-h...
2019-06-18 15:44:09
675
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人