- 博客(109)
- 收藏
- 关注
原创 Vue页面生成导出PDF文件
使用浏览器自带打印方法window.print(); 也可使用print-js插件(原理相同);html2canvas + jspdf联手
2024-04-18 14:43:32
3232
原创 Vite 踩坑 —— require is not defined
require 是属于 Webpack 的方法,而我使用的是 Vite,所以我们需要去寻找 Vite 静态资源处理的方法。所以,我们只需要将代码改写以下形式即可。动态require引入图片报错。
2023-10-18 14:06:09
749
原创 Web Components
Web Components标准非常重要的一个特性是,它使开发者能够将HTML页面的功能封装为custom elements(自定义标签),可以使用CustomElementRegistry来管理自定义标签。
2023-08-22 11:21:01
564
原创 Can‘‘t connect to MySQL server on localhost (10061)解决方法
Can''t connect to MySQL server on localhost (10061)解决方法
2023-04-12 09:04:10
10116
原创 SVG学习
font-family、font-style、font-weight、font-variant、font-stretch、font-size、font-size-adjust、kerning、letter-spacing、word-spacing和text-decoration。线性渐变的stop节点通过指定位置的offset属性和stop-color属性来说明在渐变特定位置上是什么颜色,偏移量应该始终从0%(0)开始到100%(1) 结束。如果后面存在额外的字符,耗尽他们最后一个字符之后放置的位置。
2023-03-13 09:11:11
585
原创 vue中关于后端返回文件流后前端如何下载及自定义名称
前端实现下载excel、img、zip....方法有两种 1. 直接调接口进行下载 后端进行处理 多GET请求 2. 调取接口返回对应的文件流,前端进行处理 多POST请求 axios.get("/dq/task/record/detail/excel/exportDetail2?id=2", { responseType: 'blob' // zip文件流需要添加,不然文件无法...
2022-04-12 10:50:23
3327
原创 复习 Javascript模块化
CommonJS: 模块加载是同步暴露模块 => module.exports = value => exports.xxx = value暴露的本质都是exports这个对象引入模块 require(xxx) => 第三方模块: xxx为模块名 => 自定义模块: xxx为模块文件路径实现: 服务器端实现 => node.js 浏览器端实现 => browserify(...
2021-10-10 15:24:31
132
原创 后台配置商品规格sku(vue+element)
效果gif:主要数据结构:规格项:goodsSpecs: [ { attr:"颜色", valueList:[{"title": "红"},{"title": "黄"}]}, { attr:"尺寸", valueList:[{"title": "大"},{"title": "中"},{"title": "小"}] }]table表格头默认的数据:tableHeaderList: ['stock', 'withhold_stock', 'market_pric.
2021-10-10 14:54:05
5912
8
原创 图片底部空白缝隙问题
img { vertical-align: bottom;}给图片添加 vertical-align: middle | top | bottom 等。(推荐使用) 把图片转换为块级元素 display: block; (转换块级元素可能会影响布局,所以推荐使用第一种) 容器 line-height 足够小. 只要半行间距小到字母x的下边缘位置或者再往上, 自然就没有了撑开底部间隙高度空间了. 比如: 容器设置 line-height: 0; 容器 font-size 足够小....
2021-08-23 09:11:53
152
原创 Nuxt.js去除data-n-head属性
在nuxt.config.js添加即可export default { hooks: { 'render:route': (url, result) => { result.html = result.html.replace(/data-n-head=\"ssr\"/gi, ''); } },}
2021-07-12 23:09:06
1109
原创 vue-cli4的浏览器兼容babel的配置
实现方法步骤:1. 下载babel-polyfill以及es6-promisecnpm install --savebabel-polyfilles6-promise2.在main.js顶部进行引入import'babel-polyfill'importpromisefrom'es6-promise'promise.polyfill()3.为防止vue-router在ie中不起作用添加一下代码(可以不写)newVue({router,s...
2021-05-19 23:23:05
1850
原创 vue+Notification(浏览器通知)
created() { if (window.Notification) { // 浏览器通知--window.Notification if (Notification.permission == "granted") { console.log("允许通知") }else if( Notification.permission != "denied"){ console.log("需要通知权限") .
2021-05-17 14:42:55
3019
原创 tinymce编辑器上传本地视频
直接上代码:plugins和toolbar要加上 media,然后通过file_picker_callback和media_url_resolver进行处理 tinymce.init({ file_picker_callback: function(callback, value, meta) { //文件分类 var filetype = '.pdf, .jpg, .jpeg, .png, .gif,
2021-05-06 16:05:30
1470
4
原创 iframe使用
Theiframetag allows us to embed content coming from other origins (other sites) into our web page.iframe标签允许我们将来自其他来源(其他网站)的内容嵌入到我们的网页中。Technically, an iframe creates a new nested browsing context. This means that anything in the iframe does not inte..
2021-04-26 13:47:26
2082
原创 vue ssr服务器渲染笔记
服务器端server 和 客户端client服务端渲染主要使用vue-server-renderer插件https://www.cnblogs.com/aliwa/p/8505284.html通过vue-cli3构建一个SSR应用程序https://juejin.cn/post/6844903678646681607#heading-9vue项目迁移nuxthttps://zhuanlan.zhihu.com/p/55129840...
2021-03-28 16:41:20
100
原创 实现装修页面组件拖拽(vue)
主要使用了vuedraggable插件和element-ui库每个组件通过按需引入的方式引入到装修页面安装依赖要使用npm 不然会报错 npm run dev运行后打开http://localhost:3001/#/design文件结构分析附上GitHub的demo地址:https://github.com/harrietjia/vue-page-design 可以通过代码进一步分析 有帮助的请帮忙点下star...
2021-03-28 16:35:17
3715
4
原创 小程序设置页面禁止分享
1、wx.hideShareMenuhttps://developers.weixin.qq.com/miniprogram/dev/api/share/wx.hideShareMenu.html2、删除页面onShareAppMessage方法
2021-03-19 15:08:07
7528
原创 vue 图标简单抖动晃动效果
<div class="fixed-box" > <img class="rotate" :class="[{'r1': shrinkPacket}, {'r2': !shrinkPacket}]" src="../../../assets/images/consume_packet.png"/> </div>.fixed-box { position: fixed; left: 5px; bottom: 6rem; width.
2020-10-26 18:13:53
2655
原创 vue 微信h5页面跳转到小程序 wx-open-launch-weapp(多个)
微信官方文档:微信官方文档微信版本要求为:7.0.12及以上。 系统版本要求为:iOS 10.3及以上、Android 5.0及以上。1、先请求接口配置微信需要的一些参数// 需要先请求后端接口 let url = window.location.href.split("#")[0];let shareConfig = await shareViewAPI.getWechatConfig({url});let _this = this;// 将接口返回的信息配置 wx.config(
2020-09-08 13:46:58
2756
原创 微信小程序页面上拉触底调用子组件加载更多
当父组件引用了子组件的时候,会遇到父组件执行子组件的方法,比如下拉刷新上拉加载等事件只有在页面中才能检测到,但是获取数据的方法在子组件,这时就可以执行子组件方法。思路很简单,类似于vue中给子组件加ref执行子组件方法道理一样,这里是给子组件加一个 属性: id="子组件名称",比如:子组件的父元素不能用wx:if 可以用hidden<showbusiness id="list"></showbusiness>然后在父组件对应的方法中直接this.sele..
2020-08-24 14:04:27
1269
原创 小程序使用云调用进行文本过滤
首先点击云开发配置app.json写上“cloud”:true,如图project.config.json写上云函数所在目录"cloudfunctionRoot": "cloudfunctions/",如图没有生成文件的话就在小程序根目录下创建云函数文件夹云函数目录右键新建node.js云函数,填写名字,并确认部署,等命令提示符弄完├─checkContent│ config.json //云调用的权限配置│ index.js //云服...
2020-07-25 14:17:04
502
原创 移动端VUE对于PDF图片手势缩放和移动(结合hammer.js)
最后的效果是这样的 ,关于PDF文件显示就交给后端了,因为这个项目需要显示电子章和后端生成的文字所以直接后端生成图片更省事。首先第一个坑直接引入hammer.js手势没触发要用npm安装"vue2-hammer": "^2.1.2"关于手势启用的方法 一定要放在mounted里而且PDF图片要已经返回,这里主要监听pan(移动)和pinch(缩放)// 启动缩放功能 setPinch() { let that = this; let oldSca..
2020-05-12 14:42:54
5094
13
原创 vue拖动改变div宽度
TextWidthChange(e) { let odivParent = e.currentTarget.parentNode; //获取目标父元素 let dx= e.clientX;//当你第一次单击的时候,存储x轴的坐标。 let dw= odivParent.offsetWidth;//存储默认的div的宽度。 docum...
2020-04-14 17:13:49
3120
原创 解决弹出层滚动穿透的问题
一个棘手的问题:弹出层的滚动穿透,即弹出层滚动,那么被弹出层覆盖的下面的内容区域也会进行滚动。弹出层我是用的view标签然后使用的position:fixed进行的定位;说一下我的解决思路:一:当弹出层里面无滚动的时候:可以在遮罩的view标签上定义一个防止事件冒泡的方法: 1 2 3 4 5 6 catchtouch...
2020-03-03 19:29:54
1281
原创 关于前端PDF显示和盖章(vue)
PDFhttps://www.jianshu.com/p/94cf6ddcb299https://segmentfault.com/a/1190000016963084
2020-02-23 11:55:08
10438
17
原创 vue 翻页组件vue-flip-page
方法change (改变页面)tap (点击)turning (正在翻页)prev (前一页)next (后一页)翻到指定页面:handleSwitchManual(index) { if (index === this.currentIndex) return; this.$refs["turn"].toPage(index); t...
2020-02-04 14:28:24
8403
14
原创 npm 更换源
更换仓库源:淘宝的仓库源:npm config set registry https://registry.npm.taobao.org/npm官方仓库源:npm config set registry http://www.npmjs.org发布包的时候npmjs的网址:npm config set registry http://registry.npmjs.org/参考...
2020-02-03 21:42:28
409
原创 vue 日历组件 vue-calendar-l
方法select (选择日期)monthChanged (滑动移动月份)传入参数: options: { type: Object, default: function() { return { header_bg_color: "#ffffff", //头部颜色 header_font_color: "#ffa300"...
2020-02-01 16:02:47
1409
2
原创 js数组和字符操作
JavaScript中数组元素删除汇总https://www.cnblogs.com/yun1108/p/9505294.htmlJavaScript数组去重https://segmentfault.com/a/1190000016418021?utm_source=tag-newestjs常用的4种截取字符串方法https://blog.csdn.net/u011277123/...
2019-12-19 13:41:14
111
原创 Vue 项目解决微信分享总是首页的bug
// app.vuewatch: {$route: {immediate: true,deep: true,handler(to) {// 微信浏览器判断const WECHAT_BROWSER = navigator.userAgent.toLowerCase().includes('micromessenger')// 解...
2019-12-16 14:07:39
440
原创 mysql.zip版本(5.7.27)的安装整理
参考:https://www.cnblogs.com/lxlin/p/9635350.htmlhttps://www.cnblogs.com/jingjimanbu/p/10974383.htmlmy.ini[client]port=3306default-character-set=utf8[mysql]# 设置mysql客户端默认字符集default-charact...
2019-11-24 15:31:09
188
原创 vue实现路由权限 :router.beforeEach实现路由判断页面未登录跳转到登录页面(路由拦截)
1:在main.js(我是在app.js里面写的)全局文件中判断cookie中是否存在token,存在就按照正常的页面跳转,不存在就跳转到登录界面:router.beforeEach((to, from, next) => { if (to.matched.some(record => record.meta.requireAuth)) { // 判断该路由是否需要登录权...
2019-11-12 13:28:41
1678
原创 vue项目中实现多语言 vue-i18n处理动态加载后端数据语言
项目要求多语言 最好是可以根据后台配置的显示首先是安装npm install vue-i18n -S当然也可以这样:<script src="https://unpkg.com/vue-i18n/dist/vue-i18n.js"></script>然后需要在main.js中引入文件1、添加locales文件夹新建一个locales文件夹,存放...
2019-11-07 18:26:07
11195
原创 vue2.0+ 移动端 部分较低版本系统手机出现的白屏问题
最近的项目中遇到了有些低版本系统(如ios<11)会出现白屏问题。首先要知道的时候白屏问题应该是js报错 js运行中断 一些router进的页面也没发加载,而这些js大都是因为不支持es6语法而导致的。那知道怎么知道你的js是否报错了呢,因为我们开发调试的时候大都用Chrome,Firefox这样的浏览器,内核较为先进,不会因为不识别es6而报错。所以首先用你的微信pc客户端自带的浏览器...
2019-11-07 10:40:19
1506
原创 关于webpack升级和打包
webpack1.0升级(搭配的是vue)首先要了解webpack每个配置的作用,主要参考下面的链接:https://www.cnblogs.com/libin-1/p/6596810.htmlhttps://www.jianshu.com/p/0bd6d0df79fbhttps://juejin.im/post/5bd9838df265da393c06033a因为原本webp...
2019-11-02 21:12:30
309
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人