标签: 前端

从零搭一个自用的前端脚手架的方法步骤

为什么要弄个脚手架对于我个人,经常写些demo,或者写一个新项目的时候,要么就是把以前的项目模板复制一份,要么就是重新搭建一份,显得比较麻烦,浪费时间,所以就有了搭建一个能满足自己需要的脚手架。脚手架的效果这是一个基本的脚手架,init一个项目,输入项目名称,版本号等信息,然后从git仓库拷贝一份自...

JavaScript 2021-04-28 216 0 0 阅读全文

Vue监听路由变化时Watch方法会执行多次的原因及解决

本人前端菜鸟一名,一直致力于不间断的生产管理后台的bug,并以此自勉自励。近几天接到一个需求,网上也搜了很多例子,但是没有从根本上解决。在这里记录一下我自己的解决的过程,这也是第一次在掘金发言,求轻虐。需求描述:有A、B两个页面,需要将A页面的orderId用路由传参的方式传入到B页面执行数据关联查...

JavaScript 2021-04-09 176 0 0 阅读全文

Vue 如何追踪数据变化

背景工作中时不时就会遇到这种情况:页面上显示的数据不对,需要前端同事进行定位。在一个使用Vue搭建的SPA应用上,页面最终展示的数据,从初始化,到最后的展示,过程可能很简单,也可能很复杂。遇到复杂的数据流,没有合适的方法,排查起来会很头疼。如果能够看到数据发生变化时的调用栈,就可以知道在错误的数据生...

JavaScript 2021-04-09 167 0 0 阅读全文

中级前端工程师必须要掌握的27个JavaScript 技巧(干货总结)

和许多其他语言一样,JavaScript也需要靠很多小技巧去完成各种不同的事情。有的可能早已经广为人知,有的却可能会让你感到有些迷惑。接下来先介绍27个马上就能用起来的JavaScript小技巧,下面和小编一起来看看吧!1.判断数据类型使用Object.prototype.toString配合闭包,...

JavaScript 2021-04-28 191 0 0 阅读全文

详解Vue中的Watch和Computed

对于使用Vue的前端而言,watch、computed和methods三个属性相信是不陌生的,是日常开发中经常使用的属性。但是对于它们的区别及使用场景,又是否清楚,本文我将跟大家一起通过源码来分析这三者的背后实现原理,更进一步地理解它们所代表的含义。在继续阅读本文之前,希望你已经具备了一定的Vue使...

JavaScript 2021-04-14 148 0 0 阅读全文

解决Vue Init Webpack 下载依赖卡住不动的问题

有时候下载依赖的时候网速不行,这时候我们选择手动下载依赖有时候下载依赖的时候网速不行,这时候我们选择手动下载依赖:选择No,Iwillhandlethatmyself生成完项目之后,再cd进入项目文件夹,然后再npminstall安装即可。但是如果真的安装“个把”小时也没成功那就用:cnpminst...

JavaScript 2021-04-14 135 0 0 阅读全文

SpringBoot结合JSR303对前端数据进行校验的示例代码

一、校验分类数据的校验一般分为**前端校验、后端校验**二、前端校验前端校验是最为明显的,先说一下:①HTML非空校验如HTML5新增的属性required="true",一旦没有填写就输入框就显示红色,具体使用如:②JS同时在提交表单发送Ajax请求的时候,来个onSubmit...

Java 2021-05-19 173 0 0 阅读全文

详解Flutter混排瀑布流解决方案

背景流式布局,这是一种当前无论是前端,还是Native都比较流行的一种页面布局。特别是对于商品这样的Feeds流,无论是淘宝,京东,美团,还是闲鱼。都基本上以多列瀑布流进行呈现,容器列数固定,然后每个卡片高度不一,形成参差不齐的多栏布局。对于Native来说,无论是iOS还是Android,Coll...

Android 2021-04-05 158 0 0 阅读全文

短视频(Douyin)去水印工具的实现代码

现在视频号非常火热,之前在做抖音和快手的人就直接把之前的视频直接搬运过来了。但是从抖音app下载的视频都是带官方水印的?这个是怎么去掉的?哦,不对,他们应该都有保留原视频的吧。但是还有很多人是直接搬运别人的视频的,那他们是怎么去水印的呢?其实早就有很多现成的工具,如小程序、去水印app都能直接去水印...

JavaScript 2021-04-05 341 0 0 阅读全文

前端必备Nginx配置详解

Nginx(enginex)是一个轻量级高性能的HTTP和反向代理服务器,同时也是一个通用代理服务器(TCP/UDP/IMAP/POP3/SMTP),最初由俄罗斯人IgorSysoev编写。基本命令nginx-t检查配置文件是否有语法错误nginx-sreload热加载,重新加载配置文件nginx-...

Nginx 2021-04-28 172 0 0 阅读全文

Javascript中导出与导入实现模块化管理教程

在理想情况下,开发者只需要实现核心的业务逻辑,其他都可以加载别人已经写好的模块。但是,在ES6以前,JavaScript一直没有自己模块体系(module),无法将一个大程序拆分成互相依赖的小文件,再用简单的方法拼装起来。如果要想在前端做模块化开发,必须依赖第三方框架来实现,如:requireJS与...

JavaScript 2021-04-09 132 0 0 阅读全文

原生Js基于Canvas实现一个简单的前端截图工具代码实例

这篇文章主要介绍了原生js基于canvas实现一个简单的前端截图工具代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下先看效果代码如下*{padding:0;margin:0;}.clip-img-w{position:relative;wid...

JavaScript 2021-04-27 155 0 0 阅读全文

前端正则表达式书写及常用的方法

正则表达式(regularexpression)描述了一种字符串匹配的模式(pattern),可以用来检查一个串是否含有某种子串、将匹配的子串替换或者从某个串中取出符合某个条件的子串等。前端正则表达式书写一.写法写法一/正则表达式/修饰符修饰符/i(忽略大小写)/g(全文查找出现的所有匹配字符)/m...

JavaScript 2021-04-28 139 0 0 阅读全文

Vue实现移动端Input上传视频、音频

vue移动端input上传视频、音频html部分现场视频上传视频现场音频频上传音频js部分getVideo(ev,typer){lettaht=this//获取上传文件标签letfilesId=document.getElementById('pop_video');//获取音频标签letvideo...

JavaScript 2021-05-20 166 0 0 阅读全文

如何以拖拽方式生成Vue用户界面

前一阵子拜访了一些小伙伴,大家都表示苦前端太久了,需要花费不少时间在前端开发上。本着在不损失灵活性的前提下尽可能提高开发效率的原则,作者尝试在框架内集成了拖拽方式生成Vue用户界面的功能作为补充,以方便快速生成增删改查界面,也可以用于大屏展示及简单的网页制作。一、技术原理1.1布局目前仅实现了基于v...

JavaScript 2021-04-06 202 0 0 阅读全文

React+Antd 递归实现树状目录操作

1.写在前面作为前端小白的我一直对算法和数据结构浅尝辄止,哝,吃亏了。使用多次递归实现数据格式化后将数据进行树状展示的目的,分享一下我这次挠头的经历~2.数据后台传过来的数据大概是这样的{"data":[{"id":1,"name":&qu...

JavaScript 2021-04-13 142 0 0 阅读全文

Vue中常见的问题及解决方法总结(推荐)

有一些问题不限于Vue,还适应于其他类型的SPA项目。1.页面权限控制和登陆验证页面权限控制页面权限控制是什么意思呢?就是一个网站有不同的角色,比如管理员和普通用户,要求不同的角色能访问的页面是不一样的。如果一个页面,有角色越权访问,这时就得做出限制了。一种方法是通过动态添加路由和菜单来做控制,不能...

JavaScript 2021-04-06 137 0 0 阅读全文

Antd Form表单数据回显操作

index页面有一个表格,有一个新增按钮,点击新增按钮或表格编辑弹出表单模块,如果是编辑,会回显对应的表格中的数据//index页面importReactfrom'react'import{Table,Button,message,Input,Select,Modal,}from'antd';con...

JavaScript 2021-04-13 161 0 0 阅读全文

JavaScript+Html实现前端页面滑动验证(2)

分享炫酷的前端页面滑动验证前面已经发过一种,这里再发一种,只是特效不一样还是直接上代码Title/*滑动控件容器,灰色背景*/#dragContainer{position:relative;display:inline-block;background:#e8e8e8;width:300px;he...

JavaScript 2021-06-07 146 0 0 阅读全文

JavaScript+Html实现前端页面滑动验证

分享炫酷的前端页面滑动验证直接上代码Title.input-val{width:200px;height:32px;border:1pxsolid#ddd;box-sizing:border-box;}#canvas{vertical-align:middle;box-sizing:border-b...

JavaScript 2021-06-07 208 0 0 阅读全文