前端
段友吊缠腰
这个作者很懒,什么都没留下…
展开
-
使用VUX组件库,苹果系统升级至IOS16后样式错乱
cell-form-preview2, form-preview组件中lable宽度被拉甚至100%。IOS16 系统不支持text-align-last 属性,VUX组件库源码又长久不维护更新。原创 2022-11-15 12:37:54 · 887 阅读 · 1 评论 -
pdfjs-dist 预览 PDF
【代码】pdfjs-dist 预览 PDF。原创 2022-09-28 10:32:37 · 1117 阅读 · 0 评论 -
微信公众号内下载pdf等文件,受微信所限制,安卓和IOS不同处理方式(最最最优版)
后觉得还有更好的解决办法,这次真的找到更加优化版本,一定需要后台配合才行:后台接口返回文件流,不用判断安卓还是IOS,统一前端点击按钮使用form表单提交,安卓会自动弹出默认浏览器引导,IOS会弹出下载窗口。这个应该是最优版本。这里有个知识点,form表单提交,method=‘get’请求 action 无法携带?method=“post’可以携带。原创 2022-09-16 17:16:09 · 3946 阅读 · 3 评论 -
前端Lottie动画实现方法
前端 Lottle动画实现方式原创 2022-08-17 11:10:56 · 251 阅读 · 0 评论 -
前端vue2.6升级至vue2.7后如何使用旧版本vue-router与vuex,并且修改vuex
vue2.6项目升级至vue2.7遇到的问题解决办法原创 2022-08-15 15:43:35 · 4035 阅读 · 1 评论 -
使用cnpm yarn下载依赖后,pdfjs-dist包报错
最近拉了项目使用cnpm i下载依赖的时候遇到了一一个坑,下载成功后, npm run serve 启动服务时,一直报一个错误错误是说pdfjs-dist插件使用了最新ES10语法可选链操作,网上搜索了一下,说需要安装加载器babel(搜索链接:https://www.cnblogs.com/shengwu/p/15235189.html)但是其他伙伴上都能正常运行,为什么我的就要下载babel,所以我怀疑可能是我的pdfjs-dist包版本比他们的高,我下载的包里出现了可选链,而他们的没有,于是我.原创 2021-10-21 11:46:08 · 2344 阅读 · 0 评论 -
vue 文件转base64方法 && base64转blob路径方法 && a链接下载文件 && form表单下载文件
getBase64(file) { return new Promise((resolve, reject) => { let reader = new FileReader(); let fileResult = ""; reader.readAsDataURL(file); reader.onload = () => { fileResult = reader....原创 2021-07-30 10:48:17 · 3379 阅读 · 0 评论 -
input输入框控制禁止输入空格,控制只能输入数字
原生标签与UI框架都可以使用禁止输入空格(v-model.trim 只能禁止左右两旁空格)<input type="text" oninput="value=value.replace(/\s*/g,'')"><el-input type="text" v-model='text' oninput="value=value.replace(/\s*/g,'')">只能输入数字<input type="text" oninput="value=value.replac原创 2021-07-30 10:20:14 · 994 阅读 · 0 评论 -
使用echarts当数据为空时展示空状态占位图
在开发echarts的时候我们不得不考虑数据为空的情况,其实有很多种解决办法,我自己是这样做的,有更好的办法请私信我,共同学习。大概长这样:创建你的utils:export const setNotopt = (demo,subtext = '暂无数据')=> { var option = { title: { text: ' {a|}', x: 'center', y: 'center',原创 2021-06-30 16:07:03 · 6555 阅读 · 3 评论 -
vue路由懒加载与异步组件
路由懒加载一、定义:延迟加载或按需加载,在需要的时候的时候进行加载二、作用:首屏组件加载速度更快三、方案:首先这是未使用懒加载的代码:import Vue from 'vue'import Router from 'vue-router'import HelloWorld from '@/components/HelloWorld'Vue.use(Router)export default new Router({ routes: [ { path: '/',原创 2021-04-28 17:13:26 · 379 阅读 · 0 评论 -
前端面试题大全
vue项目性能优化方案 :https://blog.csdn.net/qq_37939251/article/details/100031285vue路由懒加载的三种方式:https://blog.csdn.net/xm1037782843/article/details/88225104vue异步组件https://www.cnblogs.com/0520euv/p/13893823.htmlvue修饰符https://blog.csdn.net/wqliuj/article/.原创 2021-04-27 10:24:12 · 596 阅读 · 0 评论 -
@antv/x6在react中画人物关系图,用group画群组框
cnpm install @antv/x6 --save复制代码import React, { Component } from 'react'import { Graph, Node, Point } from '@antv/x6'class antv extends Component { constructor(props){ super(props); } componentDidMount() { Graph.registerNo.原创 2021-04-20 11:44:11 · 2795 阅读 · 2 评论 -
antv/g2在react中画柱状图,条形图与饼图
cnpm install @antv/g2 --save复制代码:import React, { Component } from 'react'import { Chart } from '@antv/g2';class Hello extends Component { constructor(props){ super(props); this.state = { data: [ { name: '.原创 2021-04-20 11:41:20 · 1563 阅读 · 1 评论 -
vis-network添加节点以外的任何图形(canvas)
包括自定义节点形状宽高内容,自定义提示框位置大小,自定义虚线框等,网上这方面需求内容较少,有问题私聊我,一起讨论,外链都用了cdn链接,复制粘贴即可运行<!-- * @Descripttion: * @version: * @Author: lzy * @Date: 2021-04-13 16:25:15 * @LastEditors: Andy * @LastEditTime: 2021-04-15 15:53:30--><!DOCTYPE html><原创 2021-04-15 16:39:34 · 1797 阅读 · 4 评论 -
前端vis-network实现拓扑图demo
直接上demo,复制粘贴即可<!-- * @Descripttion: * @version: * @Author: lzy * @Date: 2021-04-13 15:09:27 * @LastEditors: Andy * @LastEditTime: 2021-04-13 17:17:00--><!doctype html><html><head> <title></title> <sty原创 2021-04-13 17:43:23 · 1981 阅读 · 0 评论 -
vue3+vite配置全局scss
首先下载scss,sass-loader,sassnpm install --save-dev sass-loadernpm install --save-dev node-sassnpm install --save-dev sass打开vite.config.ts,添加下边代码,并重启服务module.exports = { cssPreprocessOptions: { scss: { additionalData: '@import "./src/assets/原创 2021-04-02 17:31:35 · 10984 阅读 · 9 评论 -
js中的直接赋值与浅拷贝与深拷贝的区别
js中的直接赋值与浅拷贝与深拷贝的区别////////////// 直接赋值:let foo = [1,2]let bar = fooconsole.log(bar) // [1,2]bar.push(33)console.log(bar) // [1,2,33]console.log(foo) // [1,2,33]/////////////// 浅拷贝// 使用方法// 1.Object.assign() let foo = {a:1,b:2,c:[33,44]} let ba原创 2021-04-02 17:21:12 · 195 阅读 · 0 评论 -
canvas入门API整理及用法demo
canvas 入门API整理及用法建议新建demo.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-wi原创 2021-04-02 17:18:46 · 131 阅读 · 0 评论 -
vue后台获取数据量确定渲染轮播图的页量
轮播图每页展示6条数据,数据量不确定。轮播图页数要随着数据量的大小来确定贴代码: <el-carousel trigger="click" :autoplay='false'> <el-carousel-item v-for="item in Math.ceil(industryList.length / 6)" :key="item"> <div class="whdja"> &l原创 2021-02-09 16:26:14 · 1013 阅读 · 0 评论 -
vue2和vue3两者的响应式核心原理区别
带薪摸鱼:手写一下vue2和vue3的响应式核心原理vue2:<body> <div> <input type="text" id="input"> <span id="text"></span> </div> <script> var obj = {}; Object.defineProperty(obj, 'prop', { ge原创 2021-02-09 16:09:47 · 395 阅读 · 0 评论 -
vue 的路由互相切换时怎么保持当前页面的滚动的距离?最新方案来了
最近一直有人私信我,反映之前的一篇文章《vue 的路由互相切换时怎么保持当前页面的滚动的距离?》存在问题,今天就贴出来新的思路,还得要自己多思考一下,拒绝CV,确保无问题。直接贴代码:<van-tabs v-model="active"> <van-tab title="标签 1"> <van-list v-model="loading1" :finished="finished1" f原创 2021-02-09 16:02:49 · 673 阅读 · 0 评论 -
vue3新的api ,学习vue3,记录vue3 踩过的坑之watch
在vue3 中创建动态数据的时候我们可以使用: const num = ref(1) const str = ref('foo')我们可以理解这种形式为动态数据单独管理使用监听器watch :<!-- * @Author: lzy * @Date: 2020-09-02 15:42:47 * @FilePath: \vue3\my-vue3\src\views\login.vue--><template> <div> num3: {原创 2020-09-02 17:20:33 · 724 阅读 · 0 评论 -
nvm是做什么的?nvm怎么使用
nvm安装与使用1、nvm是什么nvm全名node.js version management,顾名思义是一个nodejs的版本管理工具。通过它可以安装和切换不同版本的nodejs。下面列出下载、安装及使用方法。2、下载可在点此在github上下载最新版本,本次下载安装的是windows版本。打开网址我们可以看到有两个版本:nvm-noinstall.zip:绿色免安装版,但使用时需进行配置。nvm-setup.zip:安装版,推荐使用3、安装本次演示的是安装版。1、双击安装文件 nvm-原创 2020-09-02 10:55:07 · 6416 阅读 · 1 评论 -
拖拽一侧可以改变盒子宽度或者高度,拿来即用。
使用方法:传入字段:type:非必须 类型 水平方向 level 垂直方向 vertical 默认 levelfromName:必须,唯一的值,与项目其他地方使用的值保证不一样miniMum:非必须:最小缩放宽度直接贴代码:<!-- * @Author: lzy * @Date: 2020-07-14 18:36:53 * @FilePath: \lcfc_code\lcfc_code\src\components\moveWidth\lrMove.vue 左右拉动可以改变宽.原创 2020-08-12 09:59:51 · 1300 阅读 · 2 评论 -
基于element 日历组件写了一个简单的日志
比如我们要统计过去每日做了什么,加了两个事件显示,每日是否做了什么,加了颜色,还加了气泡提示,可以自定义,我在这里写的是一个具体日期提示。换上data里的arr就可以显示出效果啦!也参考了https://blog.csdn.net/qq493820798/article/details/106858962博主的优秀文章,加了上个月下个月按钮的点击事件,话不多说,上代码吧:<!-- * @Author: lzy * @Date: 2020-08-10 18:10:31 * @Fil.原创 2020-08-11 18:41:16 · 732 阅读 · 0 评论