前端 终端 实战vue
Vue3使用wangEditor文本
1、安装wangEditor npm install @wangeditor/editor --savenpm install @wangeditor/editor-for-vue@next --save 2、代码 <template> <el-dialog v-model="state.dialo ......
Vue_MQTT项目搭建记录
新建vue3项目 # 新建 vite + vue3的项目 npm init vue@latest yarn 安装依赖包 yarn add mqtt 初探 - 连接阿里云物联网平台 代码: <template> <div> <h1>LED - IOT</h1> <button @click="conn ......
JS前端验证
验证上传文件的是否符合要求既可以通过前端js代码验证,也可以通过后端PHP代码验证 他们的区别如下: 前端的任何代码都可以被检查网页源代码检测出来 后端的任何代码在没有拿到源码之前都无法被识别出来 通过禁用JS代码可以绕过js的前端验证 判断前端验证是否为JS代码: 1.直接查看网页源代码 2.通过 ......
Django实战项目-学习任务系统-任务完成率统计
接着上期代码内容,继续完善优化系统功能。 本次增加任务完成率统计功能,为更好的了解哪些任务完成率高,哪些任务完成率低。 该功能完成后,学习任务系统1.0版本就基本完成了。 1,编辑urls配置文件:./mysite/study_system/urls.py path('task/getClassTa ......
vue3源码学习api-vue-sfc文件编译
vue 最有代表性质的就是.VUE 的文件,每一个vue文件都是一个组件,那么vue 组件的编译过程是什么样的呢 Vue 单文件组件 (SFC)和指令 ast 语法树 一个 Vue 单文件组件 (SFC),通常使用 *.vue 作为文件扩展名,它是一种使用了类似 HTML 语法的自定义文件格式,用于 ......
前端项:步入大学所学专业总结1(有什么想补充的或有错误)的欢迎分享纠正
URL叫做统一定位符(网址)它的组成部分:协议部分://服务器地址(:端口)/文件名称) 后如需加入参数就需加一个(?) HTML是一种超文本标记语言(我通常记为网页标识) 因特网:国际计算机也称因特网,发展历史悠久,它的前身是美国国防计算机互联网,被人们公认为是未来国际信息高速公路的雏形。刚开始写 ......
vue脚手架的data与props
1.共同之处: data与props都是数据,都可以存储,并且动态渲染 2.不同之处: data是组件本身的数据,支持自身修改,然而props是外部数据(由父组件传递而来的数据),不支持自身修改,如果想要修改需要this.$emit('父组件监视函数名',希望修改的的值的结果) ......
js处理前端页面复选框多页复选同时生效的问题
虽然是后端开发,但在实际的工作中难免会碰到一些前端相关的任务需要自己处理,下面就是本人开发工作中处理的前端相关分页复选的问题。总结一下,以备日后重复遇到:<script type="text/javascript"> //初始化数据 $(function () { $('#queryButton') ......
Vue 组件里的定时器要怎么销毁?
如果页面上有很多定时器,可以在 data 选项中创建一个对象 timer,给每个定时器取个名字一一映射在对象 timer 中, 在 beforeDestroy 构造函数中清除, beforeDestroy(){ for(let k in this.timer){ clearInterval(k) } ......
记录--Vue2屎山之 Table 屎山
这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 前言 Vue2 将在 2023 年年底停止维护了,但是 Vue2 的代码却不会在 2023 年消失,还会越来越多;难以想象几十万行或者几百万行的 Vue2 代码迁移到 Vue3,这是不可能办到的; 老一点的前端程序员肯定经历过把大型项目从 ......
前端学习-JavaScript学习-JavaScript高级程序设计-第2章笔记
在HTML中使用JavaScript元素 <script>元素 元素属性 MDN <script>:脚本元素 属性 使用状态 描述 charset 可选、少用 字符集 defer 可选、少用 表示脚本可以延迟至文档完全被解析后实行,部分浏览器不支持 language 废弃 编写代码使用的语言 src ......
vue3 甘特图(四):甘特图进度条拆分
vue3 甘特图(四):甘特图进度条拆分 目前项目采取有两种拆分进度条的方式。单个进度条展示多维度数据,一个总任务条下有多个子进程展示。 1.1 单个进度条展示多维度数据(不关联时间),如图 此方法是通过设置单个进度条上内容,以一个进度条为容器,修改内容(即task_text内容)展示多维度的数据, ......
vue 甘特图(附件):甘特图附件
甘特图样式: .gantt_container { border-color: transparent !important; .gantt_right { top: 0% !important; display: flex !important; } .gantt_side_content { o ......
VUE 前端读取excel表格内容
<el-upload class="upload-demo" :action="''" :show-file-list="false" :auto-upload="false" :before-upload="beforeUpload" :on-success="handleSuccess" :on ......
【万字长文】前端性能优化实践
从一个假死页面引发的思考: 作为前端开发,除了要攻克页面难点,也要有更深的自我目标,性能优化是自我提升中很重要的一环; 在前端开发中,会偶遇到页面假死的现象, 是因为当js有大量计算时,会造成 UI 阻塞,出现界面卡顿、掉帧等情况,严重时会出现页面卡死的情况; ......
轻量级前端架构之:小程序技术
无生态,不平台。
全球人口红利瓶颈,大流量App的建设到了需要深耕流量的阶段,单纯靠自研提供业务的软件支撑,并不能留住日益多元化选择的用户,生态是深耕用户,吸引更多忠诚用户的关键。 ......
vue3 AntV-X6 引入插件报错
vue3 AntV-X6 引入插件报错: Uncaught TypeError: Cannot read properties of undefined (reading 'ToolItem') vite 引入路径的问题解决就是在引入插件的路径后面加上/lib: import { Keyboard ......
vue基于vue-pdf实现pdf预览
<template> <div class="pdf-container"> <div class="page-tool"> 文件名称扩展 <div class="page-tool-fixed" v-if="showTool"> <span class="scale-icon" @click="p ......
如何实现元素的平滑上升?(vue和react版)
首先我们看下我们有时候需要在官网或者列表中给元素添加一个动画使元素能够平滑的出现在我们的视野中。 如上图所示,我们在vue中可以自定义指令,当我们需要的时候可以直接使用。废话不多说直接上代码。 首先我们创建一个vSlideIn.ts文件 import { DirectiveBinding } fro ......
Vue3调用Element-plus涉及子组件v-model双向绑定props问题
Vue3调用Element-plus涉及子组件v-model双向绑定props问题 在Vue3调用Element-plus的el-dialog组件时,碰到个很有意思的问题,el-dialog的属性值v-model直接控制对话框的显示与否,点击关闭对话框和遮罩区域,组件内部会自动更改v-model的值 ......
2、后端开发中、返回给前端的是时间类数据,应如何设置?
场景: 返回给前端的数据是时间格式的数据,前端界面显示格式如"2000-08-17" 或者"2000-08-17 09:44:36" 使用注解@JsonFormat @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss") private LocalDateTime ......
在vue项目开发过程中,输入框以表单形式提交后,路径中多了问号?
结果是:http://localhost:8100/#/ 改变为 http://localhost:8100/?#/ 导致路由跳转出现问题。 原因:这里是 form 表单,点击了button 按钮,触发了他的默认事件,就是触发了提交这个行为。 解决方案:使用@click.prevent 阻止默认事件 ......
读书笔记 -- Junit 实战(3rd)Ch07 用 mock object 进行测试
8.1 mock object 简介 隔离测试:最大优点是能编写专门测试单一方法的测试代码,而不会受到被测方法调用某个对象所带来的副作用的影响。 mock object (mocks):非常适合测试与代码的其余部分隔离开的一部分代码。 mocks 与隔离测试的区别:mock 并不实现任何逻辑,只提供 ......
前端学习-JavaScrip学习-cookie
在使用Microsoft edge的时候,运行以下代码会报兼容性错误,但是一直没解决 'content-type' header charset value should be 'utf-8'. 使用chrome不会存储cookie 也没有报错 使用火狐可以成功存储cookie <!DOCTYPE ......
推荐一个前端读取CSV文件的插件Papa Parse
Papa Parse点击跳转到官网,该插件可以将文件解析成2层数组。 下面是vue项目引用的方法 1.安装 npm install vue-papa-parse 2.引入,在main.js里 import Vue from 'vue' import VuePapaParse from 'vue-pa ......
Ubuntu18.04 打开终端报错: ERROR: ld.so: object ‘xxx.so‘ from LD_PRELOAD cannot be preloaded 解决办法
1、问题现象在文件界面打开终端的时候,突然发现开头有一堆报错ERROR: ld.so: object './envlib.so' from LD_PRELOAD cannot be preloaded (cannot open shared object file): ignored.ERROR: ......
磨练前端技能的 10 大网站
1. Javascript 30 JavaScript 30 是由流行的 Web 开发人员和教育家 Wes Bos 创建的网站,它提供免费的 30 天挑战,帮助人们提高他们的 JavaScript 技能。该挑战赛由 30 个短视频教程组成,每个教程都专注于 JavaScript 的不同方面。教程的范 ......
前端禁用复制
//禁用复制 disableTextSelection: function () { // 给特定的元素添加自定义属性 $("body").attr("oncontextmenu", "window.event.returnValue=false"); //禁用了鼠标右键点击时的上下文菜单。 $(" ......
怎么捕获 Vue 组件的错误?
errorCaptured 是组件内部钩子函数,当捕获一个来自子孙组件的错误时被调用,接收 error、vm、info 三个参数,return false 后可以阻止错误继续向上抛出 errorHandler 为全局钩子函数,使用 Vue.config.errorHandler 配置,接收参数与 e ......
Vue3实现图片滚轮缩放和拖拽
在项目开发中遇到一个需求: 1:用鼠标滚轮可对图片进行缩放处理 2:点击按钮可对图片进行缩放处理 3:可对图片进行拖拽处理 我在开发中通过自己实现与百度查看优秀的铁子进行了两种类型的使用 <template> <div ref="imgWrap" class="wrap" @mousewheel.p ......