-
Element UI 多选框组用法笔记
今天给大家分享一下Element UI 多选框组用法笔记，直接上代码！<html> <head></head> <body> <el-form> <el-form-item label="兴趣爱好:"> <el-checkbox-group v-model="form.che...
-
在Vue3中点击链接下载文件
我在用 Vue 3 重写我之前开发的 Vue 2项目的时候，在创建 Vue 3 的项目时没有直接在 HTML 里嵌入 vue 的 JavaScript 代码，而是通过 vue-cli 4.5.11 的方式创建的。发现它的项目文件的目录结构有所变化。那么在项目里需要提供一个功能，就是在点击 HTML 里的<a>标签后并不是进行页面的跳转，而是要直接下载文件。此时<...
-
vue3中对computed，watch等方法的详解
我们在使用vue3之前，先来看看vue2中mounted，computed，watch等都是怎么用的，钩子函数、计算属性computed和监控器watch，是我们在vue2中必不可少的必学方法，我们来对比学习看在vue3中如何使用，会加深我们的印象。请看下面的代码：<script> export default { data: { return {...
-
JS的高阶函数和回调函数
高阶函数:如果一个函数的参数或者返回值为一个函数，该函数叫做高阶函数回调函数：作为参数的函数叫做回调函数例如：上述a函数的参数是个函数，为高阶函数。b函数作为a函数的一个参数，所以b函数为回调函数。函数作为返回值：上图函数c的返回值是个函数，所以c也被成为高阶函数。
-
研究JavaScript的六项基础与组织方式
一、开宗明义JS的每一个单独的文件都是一个独立的program。二、数值与数据Value and DataJS中的Value就是Data，有两种形式分别为primitive和object。其中primitive包括1）number（bigint）， 2）string（interpolate）3）boolean 4) undefined and null 5) Symbol 而剩...
-
JS排序算法：冒泡、选择、插入、归并、快速、希尔、堆、计数
1. 冒泡排序算法实现（javascript）//冒泡排序算法(javascript) //author：Hengda //arr数组 //mode false 升序 ture 降序 function bubbleSort( arr, mode ){ var i, j, temp, len = arr.length; for( i = len - 1 ; i...
-
尤雨溪新品Vite的魔力，详解
Webpack工具的出现是为了解决 ES Modules 模块系统本身的环境兼容问题、以及零散的模块文件导致的频繁网络请求发送和模块化发散的问题等等。既然已经有了 Webpack，尤大再整一个 Vite 到底有啥用呢？本质上，webpack 是一个现代 JavaScript 应用程序的静态模块打包器（module bundler）。Vue 脚手架工具 vue-cli 使用 we...
-
前端：ElementUI+VUE 日期控件禁用用法
今天给大家整理一下ElementUI+VUE 日期控件禁用用法，希望对大家有所帮助！HTML文件<el-date-picker v-model="value" type="date" :editable="false" placeholder="开始日期" value-format="yyyy-MM-dd" :picker-options="pic...
-
前端开发-文本拷贝插件
clipboard.js是一款强大且实用的文本拷贝插件，目前github的stars量30K以上一、安装1、通过npm工具安装npm install clipboard --save2、html文件直接导入github搜索clipboard直接下载源码文件包<script src="js/clipboard.min.js"></script>二、使用1、...
-
vue3的ref、reactive、toRefs特性详解
了解ref()、reactive()这两个特性之前，我们先回顾一下vue2中data和method方法。在vue2中我们定义一个响应式变量name，通过点击事件handle来改变name的值是通过如下方式写的。这样只要name改变则界面相应的会发生改变，这就是数据的双向绑定。<template> {{name}} <template> <...
-
封装一个基于Vue的评论留言编辑器组件
基本介绍现在市面上有非常多的基于 Vue 的组件库，但是看了好多都没有发现有关留言评论的组件，这对于想做一些文章信息展示类的项目可就显得棘手了，因为有太多的页面需要这个功能了，难道我们需要重复的去写（复制粘贴）这些代码吗？对于现在模块化体系逐渐完善的前端工程项目来说，一次性封装一个通用功能的组件式非常有必要的，那现在我们就去封装这样一个组件吧！必备技术（Vue）由于封装的组件式...
-
reduce的高级用法
reduce作为ES5新增的常规数组方法之一，对比forEach 、filter和map，在实际使用上好像有些被忽略，发现身边的人极少用它，导致这个如此强大的方法被逐渐埋没。如果经常使用reduce，怎么可能放过如此好用的它呢！我还是得把他从尘土中取出来擦干净，奉上它的高级用法给大家。一个如此好用的方法不应该被大众埋没。下面对reduce的语法进行简单说明，详情可查看MDN的r...
-
H5聊天video标签和视频文件下载那些怪事
最近在做一个即时聊天项目，用户要求除了可以发送图文，还要发送视频信息。刚开始觉得很简单呐，和普通文件下载不是一样？！谁知联调过程中就垮了，视频加载贼慢，根本无法观看。有的视频还没法加载，你知道的，前端直接裂了！！！<video autoplay loop > <source src="//localhost:8080/gesture.mp4" type...
-
如何使用Select组件封装成级联组件
前言因为工作内容变更的原因，在20年的时候，我的前端技术栈由Angular转移到了Vue。 它们都是现阶段比较火的前端框架，在一开始的时候，需要快速地转换一下组件设计的思想。到现在也有半年多的时间了，我现在的前端技术栈主要如下：前端框架：Vue 2UI框架： Element UI开发语言： TypeScript使用这些技术，不断地开发、封装一些项目中的组件，乐此不疲。需求在项目...
-
表单设计器1.2.20，更新多端适配和表格布局优化
介绍FormMaking是一款基于Vue的表单设计器，拖拽式的表单设计器可以很方便的进行表单设计与表单制作，通常用在OA系统，考试系统，报表系统中，支持表单设计器二次开发，可以自行添加新的自定义组件，让表单开发简单而高效，赋能企业实现低代码开发模式！FormMakingFormMaking表单设计器分两个部分，一个是设计器，一个是生成器，设计器可以用来设计器表单页面，使用拖拽的...
-
javascript数组求和的实际应用
javascript有下面一组数据const data = [ { name:'小明', score:'90',age:10 }, { name:'小王', score:'100',age:9 }, { name:'小赵', score:'80',age:9 }, { name:'小强', score:'97',age:8 }]我们现在的需求是对score和age两列进行求和计...
-
JS简单的二级联动菜单
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>JS简单的二级...
-
深入理解JavaScript作用域、作用域链
变量（变量作用于又称上下文）和函数生效（能被访问）的区域或集合。换句话说，作用域决定了代码区块中变量和其他资源的可见性。我们来看个例子：function myFunction() { let inVariable = "函数内部变量"; } myFunction();//要先执行这个函数，否则根本不知道里面是啥 console.log(i...
-
一个支持将html转为PDF、图片，且支持PDF加水印的项目
今天给大家推荐的这个开源项目是来自于读者的投稿，我超级喜欢这个开源项目。尤其是做小程序开发的时候，经常遇到将内容生成图片分享到朋友圈。这个开源项目就能够解决你的问题，可以将 html 转为图片，还可以转为 PDF ，还支持加水印。这个开源项目就是：Doctron，它是基于 Docker、无状态、简单、快速、高质量的文档转换服务。目前支持将 html 转为 pdf、图片 (使用 ...
-
ElementUI：文本框实现远程搜索的用法
今天继续给大家分享一下Element UI 多选框组用法笔记，直接上代码！1、HTML<el-form-item label="用户列表"> <el-autocomplete class="inline-input" @clear="clearUser" clearable ...
-
前端你得会——加密解密之crypto-js（建议收藏）
场景在开发过程中，我们会经常会从当前系统跳转别的系统进行访问或者页面嵌套使用。那一般都会给到一个地址进行参数拼接，然后去访问。那么会存在一个问题，就是地址暴露在外面参数使用明文的话会被篡改，极度不安全。这个时候我们就考虑到加密，前端和后端协定好一种加密方式，然后前端进行参数加密传到后端，后端再去解密（可逆）。加密方式也有很多种，今天我推荐的是一款强大的前端加密/解密js库——c...
-
《锋利的jQuery》观后记
API文档 https://api.jquery.com/网页中所有 DOM结构绘制完毕后就执行，而不是在页面所有内容（例如图片等占用宽带的内容）加载完毕之后才执行事件。它允许用户在第一眼看到元素的时候，就能立即看到元素产生的一些隐藏效果、显示效果和其它效果。若要访问图像的高度等属性，可以考虑jquery提供的load（）事件。$(document).ready(functio...
-
vue 监听 全屏退出事件
解决1["fullscreenchange", "webkitfullscreenchange", "mozfullscreenchange"].forEach((item, index) => { window.addEventListener(item, () => { // 执行的操作 }); });
-
NodeJS包管理器-NPM基础
NPM是什么全称 node package manger，是Node的开放式模块登记和管理系统。官网：https://www.npmjs.cn/仓库：https://www.npmjs.com/package/repository中文参考：https://www.axihe.com/api/npm/api/api.htmlNPM能干什么社区的力量，程序员自古以来就有社区文化。加...
-
Vue.js添加全局过滤器的几种方法
过滤器基础知识Vue.js 允许你自定义过滤器，可被用于一些常见的文本格式化。过滤器可以用在两个地方：双花括号插值和 v-bind 表达式。<!-- 在双花括号中 --> {{ message | capitalize }} <!-- 在 `v-bind` 中 --> <div v-bind:id="rawId | formatId">&l...
-
一篇文章教会你jQuery应用
一 认识jQuery jQuery是JavaScript Query的缩写形式。jQuery是一款非常优秀的JavaScript库，即便是MVVM框架盛行的今天，也有超过半数的网页及应用直接或间接的使用了jQuery。jQuery的设计理念是“Write Less, Do More“，即写的更少，做的更多！使用jQuery可以大大简化我们的JS代码，从而提高开发效率。 jQue...
-
从零开始学VUE
Vue.js作为目前最热门最具前景的前端框架之一,帮助我们快速构建并开发前端项目。 本文旨在帮助大家认识Vue.js，了解Vue.js的开发流程。本节导航Vue CLI安装创建项目启动打包环境变量Vue生命周期Data模板语法复杂业务组件常用库Element安装配置栅格系统Form 表单Table 表格Vue CLIVue CLI 是官方提供快速搭建Vue项目的脚手架工具零配置...
-
vue前端根据菜单数据生成当前路由的面包屑
这段时间做了个项目，之前的前端直接用vue路由的matched参数生成面包屑，我接手项目后，发现这样生成面包屑有时候不太准，就封装了个从菜单数据里生成面包屑的方法，分享给大家，大家有其他更好的方法也可以分享出来！图一是菜单数据的json结构图二是封装的方法path：当前页面的路径！必填menuData：菜单数据！必填最后返回的是由菜单数据生成的面包屑数组！子菜单层级无限！
-
记录基于vue在我的真实项目中的性能优化
最近一段时间一直在处理公司的一个内部项目哈，因为页面卡的问题被吐槽了一个月了。因为是接手别人的项目，虽然说不是自己直接造成的。但是解决这个问题已是迫在眉睫了。可能我们在做前端开发的时候，很少去关注内存的问题，这是因为JS有自己垃圾回收机制，如果代码不是滥用闭包，一般来说，不会出现性能问题。先来大概说下我的项目中性能瓶颈的现象：项目是一个基于electron+vue的一个类似微信...
-
Vuex状态管理插件
一、引言在Vue.js的组件基础中，我们在两个组件之间传值使用的是props（父组件向子组件传值），自定义事件this.$emit方法（子组件向父组件传值），对于简单的组件比较少的，而且依赖不复杂的我们可以使用，但是，如果组件很多，而且依赖很复杂，两个组件不一定是父子关系，而且关系比较远的时候，如果我们还是使用传统的传值方式，那将会是一场灾难（两个距离比较远的组件如果使用传统方...