- 博客(22)
- 收藏
- 关注
原创 nginx基础配置
# 全局配置#配置用户或者组,默认为nobody#user nobody; #允许生成的进程数,默认为1worker_processes 1;#制定错误日志路径,级别。这个设置可以放在全局块(当前),http块,server块,级别依次为:debug|info|notice|warn|error|crit|alert|emerg#error_log logs/error.log; #error_log logs/error.log notice; # notice 级别#
2022-05-20 22:45:34
300
原创 element 图片预览组件 点击图片显示当前图片
elementUI的el-image元素有一个预览属性preview-src-list .设置了这个属性的话, 将开启图片预览功能但是点击图片后显示的是list第一条的图片,接下来是解决的办法。点击图片, 显示当前图片预览图, 不可轮播 <template> <el-table :data="tableData"> <el-table-column label="图片"> <template slot-scope
2022-04-20 11:37:48
4656
1
原创 手写promise.all
function promise_My_All(primiseArr){ let arr = [],count=0; return new Promise((resolve,reject)=>{ primiseArr.forEach((item,index) => { Promise.resolve(item).then(res=>{ arr[index] = res;
2022-04-12 17:10:23
292
原创 vue.config.js 打包配置大全
1.使用cdn引入不改变的第三方库const cdn = { // 忽略打包的第三方库 externals: { vue: 'Vue', vuex: 'Vuex', 'vue-router': 'VueRouter', axios: 'axios' }, // 通过cdn方式使用 js: [ 'https://cdn.bootcss.com/vue/2.6.11/vue.runtime.min.js', 'https://cdn.boo
2022-03-24 10:57:33
3393
原创 js如何实现base64转文件下载保存到本地
//将base64转换为blob dataURLtoBlob(dataurl) { var arr = dataurl.split(","), mime = arr[0].match(/:(.*?);/)[1], bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n); while (n--) { u8arr[n] = bst
2022-03-18 09:50:44
7075
原创 element upload图片上传配合vue-cropper裁剪 基于vue
//主代码 //html代码 <el-upload :action="uploadImgUrl" :data="uploadParams" :show-file-list="false" :on-change="changeUpload" :before-upload="handleBeforeUpload" :auto-upload="false" > <e.
2022-03-14 13:56:55
352
原创 前端css实现收起展开组件
实现如图展开收起组件:HTML代码//flag是保证id值唯一的 防止冲突<template><div class="wrapper"> <input :id="'exp'+flag" class="exp" type="checkbox"> <div class="text"> <label class="btn" :for="'exp'+flag"></label>
2022-03-13 15:30:12
1554
原创 自适应布局方案-视口布局
html { font-size: 16px;}@media screen and (min-width: 375px) { html { /* iPhone6的375px尺寸作为16px基准,414px正好18px大小, 600 20px */ font-size: calc(100% + 2 * (100vw - 375px) / 39); font-size: calc(16px + 2 * (100vw - 375px) / 39
2021-12-21 11:23:50
127
原创 js判断打开是PC端还是移动端
<script type="text/javascript">function browserRedirect() { var sUserAgent= navigator.userAgent.toLowerCase(); var bIsIpad= sUserAgent.match(/ipad/i) == "ipad"; var bIsIphoneOs= sUserAgent.match(/iphone os/i) == "iphone os"; var bIsMidp= sU
2021-12-21 11:21:39
199
原创 js解决加减乘除失真
let compute = {// 加法运算accAdd(arg1, arg2) {var r1;var r2;var m;var c;try {r1 = arg1.toString().split(’.’)[1].length;} catch (e) {r1 = 0;}try {r2 = arg2.toString().split(’.’)[1].length;} catch (e) {r2 = 0;}c = Math.abs(r1 - r2);m = Math.pow
2021-12-01 16:23:03
633
原创 javascript笛卡称积
const type = [“男裤”, “女裤”]const color = [“黑色”, “白色”]const size = [“S”,“L”]let arr = [type ,color,size ]arr.reduce((a, b) => { return a.flatMap(x => b.map(y => [...x, y]))}, [[]] )[[“男裤”, “黑色”, “S”],[“男裤”, “黑色”, “L”],[“男裤”, “白色”, “S”],[“男
2021-09-01 20:50:38
145
原创 前端JavaScript解析excel文件
<el-upload ref="input" action="/" :show-file-list="false" :auto-upload="false" :on-change="importExcel" type="file" >上传</el-upload> importExcel(file) { .
2021-08-23 16:16:54
589
原创 JS图片懒加载 清晰易懂
<img class="img-item" src="" lazyload="true" data-src="https://scpic.chinaz.net/files/pic/pic9/202107/apic34281.jpg"> var num = document.getElementsByTagName('img'); var img = document.getElementsByTagName("img"); var n = 0;...
2021-08-06 10:05:44
116
原创 封装微信小程序的数据请求
网络请求小程序提供了wx.request// 官方例子wx.request({ url: 'test.php', //仅为示例,并非真实的接口地址 data: { x: '' , y: '' }, header: { 'content-type': 'application/json' // 默认值 }, success: function(res) { console.log(res.data) }})小程序支持ES6,那么就应
2021-07-14 15:16:06
510
原创 vue2 通过Vue.directive自定义指令实现权限判断、防抖节流
/** * 权限指令 * 例:<div v-permission="'table/del'"></div> */app.directive('permission', { inserted: function (el, binding) { const { value } = binding // 获取VueX中的 权限按钮列表 const buttonList = store.state.user.permission
2021-06-22 09:50:05
1069
原创 mapbox 自动定位到数据标记集中的点 fitBounds与flyTo
我先封装了一个方法 找到数据集中的东南角 西北角的经纬度这里我用到了lodash这个库 (这个库我还是比较推荐用的 可以提升开发效率)import { maxBy, minBy } from 'lodash'/** * 获取坐标的边框 * @param {*} arr * @returns */export function getBounds(arr, opt = { lat: "lat", lng: 'lng', isArr: false }) { const { lat,
2021-05-20 10:45:48
1756
原创 mapbox地图click点击事件判断点击处图层
map.on("click", (e) => { var features = map.queryRenderedFeatures(e.point, { layers: ["unclustered-point"], }); });//点击某处 features数组length大于0 就是点击处包含标记点或建筑物//length小于0则 点击的是最底层...
2021-05-18 16:20:09
4252
1
原创 vue watch中同时监听多个属性
vue中watch可以用来监听属性的变化,但是如果我们需要监听多个属性,并且他们多可以调用类似的方法,就会是这样子:data(){ return{ name1:"", name2:"", }},watch:{ "name1":fn(), "name2":fn()}这样子比较冗余,我们可以增加一个computed属性,来实现多个属性的监听:data(){ return{ name1:"", name2:"", }},conputed:{ listChange()
2021-05-07 15:00:32
1702
原创 vue四种页面跳转传参方法
1、push方法:跳转传参:query传参 参数会在链接后面显示 this.$router.push({ path: "/home", query: { id: 1 }, });params传参 参数不会显示在链接后面 this.$router.push({ name: "/home", params: { id: 1 }, });//params传参要用name 不能用path
2021-04-23 14:38:48
1607
原创 vue+oss前端直传oss 纯前端实现文件上传、下载、暂停上传(含demo)
let OSS = require('ali-oss');let client = new OSS({ region: '配置自己的', //云账号AccessKey有所有API访问权限,建议遵循阿里云安全最佳实践,部署在服务端使用RAM子账号或STS,部署在客户端使用STS。 accessKeyId: '配置自己的', accessKeySecret: '配置自己的', bucket: '配置自己的' })注:以上是配置OSS文件上传api接口:const put..
2021-04-23 14:23:33
3193
2
原创 js小算法-将数组处理成树状结构
let haoroomsDataArr = [ { id: 1, name: "haorooms1" }, { id: 2, name: "haorooms2", parentId: 1 }, { id: 4, name: "haorooms4", parentId: 3 }, { id: 3, name: "haorooms3", parentId: 2 }, { id: 8, name: "haorooms18", parentId: 7 }, { i..
2021-04-23 14:21:44
627
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅