- 博客(39)
- 资源 (8)
- 收藏
- 关注
RSS订阅转载 vue2中使用JSX语法报错，如何解决？
vue2中使用JSX语法报错，如何解决？1、安装必要的依赖和插件：2、在babel配置文件中添加插件：3、在组件中使用JSX语法：
2023-08-24 14:52:48
578
转载 纯前端解析.docx文件
前段时间做过一个纯前端解析.docx文件的需求，只需要解析文件的内容展示在页面上即可，需求听上去还挺简单的，然而我还是踩了到了巨坑
2023-08-17 11:24:23
609
转载 Vue动态组件的实践与原理探究
我司有一个工作台搭建产品，允许通过拖拽小部件的方式来搭建一个工作台页面，平台内置了一些常用小部件，另外也允许自行开发小部件上传使用，本文会从实践的角度来介绍其实现原理。ps.本文项目使用Vue CLI创建，所用的Vue版本为2.6.11webpack版本为4.46.0。
2023-07-26 17:00:31
845
转载 使用amfe-flexible以及px2rem-loader解决VUE移动端适配
由于 layout viewport的宽度是远大于浏览器宽度的，因此我们需要一个新的viewport来代表浏览器的可视区域宽度，这个视图则被成为visual viewport我们可以使用window.innerWidth来获取。由于viewport单位得到众多浏览器的兼容，lib-flexible这个过渡方案已经可以放弃使用，不管是现在的版本还是以前的版本，都存有一定的问题。vant组件库的设计稿是按照375px来开发的。至此，我们的viewport的适配就做好了，只需要按照设计稿的比例进行开发就可以了。
2023-05-25 14:26:20
478
转载 跨域 iframe 内嵌页面 JavaScript 写 cookie 失败解决方法
在 iframe 跨域的场景下，无论是服务器，还是内嵌的页面，如果要写入 Cookie，都需要增加Secure;转载请注明出处。本文地址:跨域 iframe 内嵌页面 JavaScript 写 cookie 失败解决方法 - 前端路迹。
2023-05-24 14:11:19
8733
4
原创 Vue 使用 ＜keep-alive include＞ 实现多级 ＜router-view＞ 缓存，无限层次缓存
，来判断这个路由中的组件是否需要缓存。然鹅，我有强迫症，不能接受没有动效 (￣(00)￣)的路由记录下来，并将该路由的name属性为维护在使用。或者嵌套路由（这是很常见的操作），这个时候后面几层。属性，它的值可以是：字符串，正则表达式，数组。这种方法是比较早版本时使用的方法，当时。接下来就可以愉快的缓存多层次的组件了。中的值来匹配当前路由对应组件的。属性，来实现动态的组件缓存。这个组件，而这个组件只是一个。组件，这明显不是我们想要的。、缓存了不必要的，用来实现。里保存的需要缓存的路由组件。
2023-05-12 10:44:53
3668
转载 vue 动态加载并注册组件且通过 render动态创建该组件
动态创建不同的、特定的组件内容，而不需要大量的 import 组件并进行 component 注册
2023-03-04 11:27:35
936
1
转载 解决使用 @vue/cli-plugin-babel 导致动态 import 代码拆分失败问题
解决使用 @vue/cli-plugin-babel 导致动态 import 代码拆分失败问题
2022-12-06 11:52:33
1825
转载 H5手机页面调起浏览器自带分享功能实例（QQ、UC浏览器微博、微信分享）
H5手机页面调起浏览器自带分享功能实例（QQ、UC浏览器微博、微信分享）
2022-06-15 09:02:45
4491
转载 IndexedDB 的api
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>...
2022-05-10 20:21:36
191
转载 z-index 和 fixed 在苹果手机ios不生效
z-index 和 fixed 在苹果手机ios不生效问题描述今天开发遇到一个问题：当一个元素固定定位时（fixed），同层级节点如果不想被固定定位的元素覆盖，那么需要设置 z-index，这样就不会被覆盖了。举个例子：A是固定定位的元素，B不能被A覆盖，所以需要设置 B z-index（同时需要设置 position: relative，因为Z-index 必须在定位的元素上才能生效）。.a { position: fixed; top: 100px; left: 100px;...
2022-04-27 09:01:58
2251
转载 限制HTML的input只能输入数字、英文、汉字...
限制HTML的input只能输入数字、英文、汉字...关键词：正则表达式, JavaScript, HTML, input常用HTML正则表达式1.只能输入数字和英文的：<input onkeyup="value=value.replace(/[/W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/d]/g,''))"ID="Text1" .
2022-03-29 18:20:46
3247
转载 跨浏览器tab页的通信解决方案尝试
目标当前页面需要与当前浏览器已打开的的某个tab页通信，完成某些交互。其中，与当前页面待通信的tab页可以是与当前页面同域（相同的协议、域名和端口），也可以是跨域的。要实现这个特殊的功能，单单使用HTML5的相关特性是无法完成的，需要有更加巧妙的设计。畅想现在我们发现下思维，假设多种场景下的解决方案，最终寻找通用解。case 1两个需要交互的tab页面具有依赖关系。如A页面中通过JavaScript的window.open打开B页面，或者B页面通过iframe嵌入至A页面，.
2022-03-17 20:59:06
1073
转载 宝塔执行sh文件_宝塔面板无法访问权限被锁 Linux面板
服务器开启保护程序导致宝塔无法启动导致python权限被锁，python没有权限了，然后被上锁了，现在解锁后重新赋予权限即可。chmod:changingpermissionsof‘/www/server/panel/pyenv/bin/python3.7’:Operation not permittedchmod:changingpermissionsof‘/www/server/panel/pyenv/bin/python3.7m’:Operation not permitted解锁pyth
2022-03-06 15:23:54
1697
原创 css bfc独立渲染区域
BFC（Block Formatting Context）块级格式上下文，是Web页面中盒模型布局的CSS渲染模式，指一个独立的渲染区域或者说是一个隔离的独立容器。下列情况都可以形成一个BFC:浮动元素，float 除 none 以外的值；定位元素，position（absolute，fixed）；display 为以下其中之一的值 inline-block，table-cell，table-caption；overflow 除了 visible 以外的值（hidden，auto，scroll）
2021-11-16 07:52:31
360
转载 js模块化编程之彻底弄懂CommonJS和AMD/CMD
先回答我：为什么模块很重要？答：因为有了模块，我们就可以更方便地使用别人的代码，想要什么功能，就加载什么模块。但是，这样做有一个前提，那就是大家必须以同样的方式编写模块，否则你有你的写法，我有我的写法，岂不是乱了套！于是下面三个模块规范出来了，这篇文章也出来了（拼出来的 {捂脸笑}）。JS中的模块规范（CommonJS，AMD，CMD），如果你听过js模块化这个东西，那么你就应该听过或CommonJS或AMD甚至是CMD这些规范咯，我也听过，但之前也真的是听听而已。现在就看看吧，这些.
2021-11-02 17:41:17
287
原创 SVG path 路径详解
SVG 的路径<path>功能非常强大，它不仅能创建基本形状，还能创建更多复杂的形状。<path>路径是由一些命令来控制的，每一个命令对应一个字母，并且区分大小写，大写主要表示绝对定位，小写表示相对定位。<path>通过属性d来定义路径，d是一系列命令的集合，主要有以下几个命令：...
2021-10-24 17:06:48
1258
转载 js实现继承的方法中为何总是要修正constructor方法的指向呢？
问题引入最近看了许多关于js继承实现的相关文章，许多实现方式中都会存在这么一行代码：A.prototype.constructor = A于是感到好奇，这行代码的实际意义是什么？如果没有的话，还能达到继承的目的吗？前置知识为了熟悉javascript中与原型相关的几个基本概念，可以参看这篇文章JavaScript深入之从原型到原型链，作者写的十分简明易懂。读了文章以后可以知道，在方法（构造函数）上存在一个叫做prototype的属性，这个属性是一个对象；方法结合ne
2021-10-20 18:03:16
442
转载 JS实现继承的几种方式
前言JS作为面向对象的弱类型语言，继承也是其非常强大的特性之一。那么如何在JS中实现继承呢？让我们拭目以待。JS继承的实现方式既然要实现继承，那么首先我们得有一个父类，代码如下：// 定义一个动物类function Animal (name) { // 属性 this.name = name || 'Animal'; // 实例方法 this.sleep = function(){ console.log(this.name + '正在睡觉！'); }}/
2021-10-20 17:36:15
37
转载 Javascript农历与公历相互转换
/**用法 * Lunar.toSolar(2016, 6, 3); 农历转化公历 * Lunar.toLunar(2016, 7, 6); 公历转化农历 */var Lunar = { MIN_YEAR : 1891, MAX_YEAR : 2100, lunarInfo : [ [0,2,9, 21936], [6,1,30, 9656], [0,2,17, 9584], [0,2,6, 21168], [5,1,26,43344], [0,2,13,5.
2021-09-24 09:45:20
928
1
原创 js上传图片，获取临时预览url
function getObjectURL(file) { var url = null ; if (window.createObjectURL!=undefined) { // basic url = window.createObjectURL(file) ; } else if (window.URL!=undefined) { // mozilla(firefox) url = window.URL.createObjectURL(file) ;...
2021-08-17 08:42:12
730
转载 解决 Flex 子元素居中，溢出滚动后被裁切的问题
晚上修改了小窝页面右侧目录树的定位，并且修改了二级导航栏的布局。其原有的设计采用的是display: flex+justify-content: center进行居中的，但这样也遇到了一个问题。如果我使用white-space: nowrap禁止文字换行（Flex 默认也是不换行，但是并不会溢出，而是会使得子元素宽度变窄导致文字被换行），并结合overflow: auto来使得内容出现滚动条，则会出现左侧被“裁切”掉的效果。上网搜索了一番，出现这个效果的原因，主要是因为 Flex 居...
2021-08-11 22:01:54
2920
转载 史上最全的常用事件：移动端事件及PC端：鼠标/键盘/表单事件
PC端事件 鼠标事件： onclick点击 onmouseover鼠标移入 onmouseout鼠标移出 onmousedown鼠标按下 onmouseup鼠标抬起 onmousemove鼠标移动 onmouseenter鼠标移入 onmouseleave鼠标移出 ondblclick鼠标双击 oncontextmenu鼠标右击，为了防止右击div的时候出现重新加载弹框return...
2021-07-27 10:11:04
903
转载 vue常用的鼠标事件
vue所有的鼠标事件： 单击 @click=‘click’ 按下 @mousedown=‘down’ 抬起 @mouseup=‘up’ 双击 @dblclick=‘dblclick’ 移动 @mousemove=‘move’ 移除 @mouseout=‘out’ 离开 @mouseleave=‘out’ 进入 @mouseenter=‘enter’ 在 @mouseover=‘enter
2021-07-27 00:20:47
9769
原创 vscode settings 常用配置
settings.json可通过 ctrl + shift + p 快捷键，搜索 json，找到 open settings，通过 settings 配置，方便我们开发，根据个人开发情况自定义{ "editor.tabSize": 2, "editor.formatOnSave": true, // 在style样式中, 使用缩进, 缩进是2个空格 "vetur.format.styleInitialIndent": true, // 在script样式中, 使用缩进, 缩进2个空...
2021-02-02 18:11:56
894
转载 docker命令大全
一、基本命令：查看镜像：docker images搜索镜像：docker search mysql:5.7.0 (5.7.0：搜索指定的版本)列出当前运行的容器：docker ps列出所有的容器（包括已停止的）：docker ps -a停止容器 ：docker stop 5d034c6ea010 （5d034c6ea010 : 容器id）进入容器： docker exec -it 容器id /bin/bash下载镜像：docker pull ubuntu（默认latest,最新版）下载带版本
2021-01-28 17:47:43
313
转载 用nginx做反向代理来访问防外链图片
博客从新浪搬到wordpress后，发现原来博客上链接的新浪相册的图片都不能访问了，一年的博客内容，一个个去重新上传图片，修正链接也是个大工程。还是得先想个其它办法。想想防外链大都是通过检查请求中的http referer来实现的。如果通过反向代理来动态指定http referer是不是可以解决问题。马上做实验，没错，方法对新浪相册用效。那接着就是搭一个反向代理了，nginx的名声现在是越来越大，资源也占用小。先用它吧。location /get/ {set $hostx “”;set
2021-01-06 15:07:10
566
转载 HTTP请求中的referrer和Referrer-Policy
本文将介绍一个涉及安全和隐私的http请求头中的字段—referrer，以及如何通过Referrer Policy去修改referrer的值或者是显示与否。什么是referrer当一个用户点击当前页面中的一个链接，然后跳转到目标页面时，目标页面会收到一个信息，即用户是从哪个源链接跳转过来的。如下图所示：也就是说，当你发起一个http请求，请求头中的referrer字段就说明了你是从哪个页面发起该请求的。使用场景有时候我们需要控制这个referrer字段的值，即是否让其显示在请求头中，
2021-01-06 10:32:39
635
原创 Nginx反向代理其他站点，Referer防盗链导致图片403错误
问题由于需要在我们的小程序中链接其他外部的网站做内容显示来满足我们的需求，但微信小程序中web-view加载网页，需要在微信公众号平台中设置业务域名，并且业务域名需要做服务器校验，这就会导致我们无法直接的使用外部的网站（如：www.baidu.com）解决方案使用 Nginx 做反向代理，配置如下：location /路径{ proxy_pass 代理网站; proxy_set_header X-Real-IP $remote_addr; ...
2021-01-06 10:30:55
2160
1
转载 ASP.NET Core 实战：使用 Docker 容器化部署 ASP.NET Core + MySQL + Nginx
转载：https://blog.csdn.net/sd7o95o/article/details/88771491一、前言 在之前的文章（ASP.NET Core 实战：Linux 小白的 .NET Core 部署之路）中，我介绍了如何在 Linux 环境中安装 .NET Core SDK / .NET Core Runtime、Nginx、MySQL，以及如何将我们的 ASP.NET Core MVC 程序部署到 Linux 上，同时，使用 supervisor守护程序守护我们的 .N...
2020-12-25 12:42:41
290
jsp上传下载组件及其应用
2008-09-08
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人