- 博客(26)
- 资源 (4)
- 收藏
- 关注
RSS订阅原创 vue3动态引入图片不显示问题
的import.meta.glob或import.meta.globEager，两者的区别是前者懒加载资源，后者直接引入。1.图片放到public 目录会更省事，不管是开发环境还是生产环境，可以始终以根目录保持图片路径的一致.，这种方式引入的文件必须指定到具体文件夹路径，传入的变量中只能为文件名，不能包含文件路径使用。方法1.(打包后动态引用的图片未被打包入工程中,webpack,vite)方法1（适用于处理单个链接的资源文件）方法2（适用于处理多个链接的资源文件）方法3（适用于处理多个链接的资源文件）
2024-08-16 10:46:54
2187
原创 vue 文件下载
针对一些浏览器无法识别的文件格式（如pdf、xls、ppt）。可以直接在地址栏上输入URL即可触发浏览器的下载功能。该方式将下载逻辑放在后端处理，后端给出固定的url，前端使用window.location.herf下载。这种方式的文件地址被访问时，访问文件路径默认是下载还是预览跟后端设置的服务器配置有关。直接下载 （使用a标签download属性）路径可以是相对路径也可以是绝对路径。3.通过后端反回流,前端进行下载。2.OSS存储方式的文件地址。平台返回二进制流格式如图。
2024-03-26 16:55:45
832
1
原创 vue 文件预览(docx、.xlsx、pdf)
支持vue2和vue3提供docx、.xlsx、pdf多种文档的在线预览方案。如果是vue2.6版本或以下还需要额外安装 @vue/composition-api。如果是原生的input type="file"，也是类似的。目前只支持docx文件预览，不支持doc文件。目前只支持xlsx文件预览，不支持xls文件。pdf代码基本一致(以docx为例)代码(与ifrem用法类似)src里面是文件地址。
2024-03-26 16:34:04
2219
原创 vue3动态路由刷新后空白或者404
在使用beforeEach 进行拦截路由采用动态路由时，页面刚初始化时路由正常跳转但页面刷新后出现空白或者404。通过后端拿到路由数据，遍历路由数据通过router.addRoute一个个的添加，同时将路由数据通过。x缓存起来，当页面刷新时，从缓存里拿出路由数据再重新添加，同时配合路由守卫来跳页面。时动态添加的路由已经被完全加载上去，一般是与添加动态路由时配合使用。刷新页面后动态添加的路由页面空白。逻辑不当的情况下，很容易死循环。
2023-06-09 11:07:10
3969
原创 H5吊起微信小程序（适用于从短信、邮件、微信外网页等场景打开小程序任意页面）
6.2获取access_token。注：拿到了openlink为前端所需的数据。
2023-06-08 17:25:51
1144
原创 vue 打印踩坑
1，安装npm install vue-print-nb --save2，引入安装好以后在main.js文件中引入import Print from 'vue-print-nb'Vue.use(Print); //注册3. 使用用包括打印区域使用方法一：<div print-icon" v-print="'#printMe'">打印</div>使用方法二：<div print-icon" v-print="printObj">打印</div&
2022-03-02 16:12:35
808
原创 vue html页面打印功能vue-print-nb
vue项目中,HTML页面打印功能组件vue-print-nb源码: https://github.com/shengbid/vue-print,https://github.com/shengbid/vue-demo 使用方式安装 npm install vue-print-nb --save在main.js文件中注册import Print from 'vue-print-nb'Vue.use(Print);页面中使用,给需要打印的容器加一个id,打印按钮传入这个idhtm
2022-03-02 16:08:38
1887
原创 网站打包exe程序
1.类的公用字段 staticclass Counter { #num = 0; static baseNum = 100; // 静态方法可以通过 this 访问静态字段 static getDoubleBaseNum() { return this.baseNum * 2; }}// 静态字段和方法通过类本身访问console.log(Counter.baseNum); // 100console.log(Counter.get
2022-03-02 15:38:33
215
原创 02.es2021新特性补充（整理）
1 String.prototype.replaceAll我们都知道String.prototype.replace()方法来完成字符串的替换'betterman'.replace('e','1111')// "b1111tterman"在 String.prototype.replace() 方法中，当第一个参数是字符串类型时，只替换第一个匹配的字符串,如果我们需要全换所有就需要使用正则匹配到'betterman'.replace(/e/g,'1111')// "b1111tt111rm
2021-09-30 09:24:05
186
原创 01ES2020新特性（整合）
1.#号的使用//在class中用#号来声明私有变量class Counter { #number = 10 increment() { this.#number++ } getNum() { return this.#number }}const counter = new Counter()counter.increment()console.log(counter.getNum()) //11console.log(counter.#numbe
2021-09-27 17:54:30
303
原创 nrm ls报错
执行命令：Set-ExecutionPolicy RemoteSigned -Scope Process执行后输入A 即可解决问题
2021-06-23 18:05:37
153
原创 vue3的用法
vue3的用法1.创建vue项目npm i vite-app <obj name>cd <obj name>npm inpm dev2.响应式<template> <div> <div>{{ data.num }}</div> <div>{{ data.setnum }}</div> <ul> <li v-for="(item, in
2021-06-23 18:01:35
251
原创 uni-app - ios禁止页面滑动（无法上下滚动屏幕页面）
注意：仅 APP 平台在 pages.json 中进行配置有些时候，我们需要将页面固定住，让用户无法下拉与滚动页面。全局配置在 globalStyle 中进行配置，便是所有页面均有效。"globalStyle": { "app-plus": {//app平台 "bounce": "none"//禁止滚动 }},局部配置在该页面 style 中进行配置，仅对该页有效。"path": "pages/login/login","style": { "app-plus": {
2021-02-20 16:27:48
4527
原创 uniapp WebView嵌入，ios端click事件点击延迟，无法连续点击
问题1最近有个需求里有个点赞的功能，每点一下赞会有特效展示，可以连续点击不断的显示特效。做出来之后在测试阶段的时候发现除了ios端app WebView内嵌h5页面无法连续点赞之外，ios其他环境都没问题。（bug总是神奇的出现）因为没啥经验，开始考虑以为是我司ios开发在app端做了不能连续点击限制，于是去问了一下，结果我司ios开发说没有！！！好了，这肯定是前端神奇的bug了，于是我再次打开了百度…找到了解决办法解决办法@click="thumbs_up()改成：@touchstart
2021-02-20 16:24:27
2346
3
原创 vue h5转换uni-app指南（vue转uni、h5转uni）
分类：uni-app转换 vue转 h5转如果你已经有了一个基于vue开发的H5站点，想转换为uni-app。首先注意2个前提：1、你的web站是适合手机屏幕的；2、你的H5代码是全后端分离的，uni-app只处理前端代码。一切从新建一个uni-app项目开始。然后依次进行文件处理把之前的vue web项目的前端代码copy到新项目下如果之前的文件后缀名是.html，需要改为.vue，并注意遵循vue单文件组件SFC规范，比如必须一级根节点为template、script、styl
2021-02-20 15:42:21
2706
原创 dva
dva的用法术1.安装npm install -g dva-clidva -v查看版本号2.创建项目dva new app3.启动项目cd app//启动项目npm start一。定义路由方法1在router.js里面添加import React from 'react';import { Router, Route, Switch } f...
2020-04-23 22:51:14
385
原创 小程序学习笔记整理
微信小程序欢迎访问我的博客，祝码农同胞们早日走上人生巅峰，迎娶白富美~~~微信小程序，简称小程序，英文名Mini Program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用。关于此学习的测试项目都暂时保存在https://github.com/ForeManWang/wxapp-study微信小程序账号与工具在线文...
2020-04-23 21:56:14
542
原创 js 常见的兼容总结12
JS常见的兼容性问题汇总1> 滚动条：document.documentElement.scrollTop || document.body.scrollTop2> 获取样式兼容function getStyle(dom, styleName){ return dom.currentStyle? dom.currentStyle[styleName] : getComput...
2019-11-02 09:39:09
347
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人