- 博客(44)
- 收藏
- 关注
原创 vue3组合式API小结
/ 2、执行函数 作用:接收简单类型或者对象类型的数据传入并返回一个响应式的对象。// 脚本区域修改ref产生的响应是对象数据 必须通过.value属性。1、作为watch函数的第一个参数,ref对象需要添加.value吗。4、不开启deep,想在某个层次比较深的属性变化时执行回调怎么做。// 2、执行函数 return 计算之后的值 变量接收。// 2、执行函数 传入一个对象类型的参数 变量接收。2、setup语法糖中如果使用父组件传过来的数据?语法糖(经过一系列的封装,将复杂的写法简单化),
2023-11-05 21:50:39 373 2
原创 vue项目在IE11中一片空白,报错SCRPT1003,SCRIPT1006
公司项目用vue写需要兼容IE浏览器,我最近做的两个项目在IE11中都是一片空白,一个是用webpack初始化的,另一个使用vue脚手架初始化的。1、用webpack初始化的这个项目在IE打开一片空白,且中报错如下图:一般情况下IE浏览器打开页面空白是js没有加载成功,报错 script1003,根据报错信息定位到是封装的一个组件直接引用了element依赖的ji,而在打包的时候报node_modules的element的js是忽略的,默认下载的是转了ES5后的。方法1:可以在webpack配置中.
2021-09-10 17:39:12 764
原创 element form表单数据未双向绑定
最近在做项目表单部分,会遇到表单数据没有双向绑定,或者双向绑定延迟。直接看代码,在vue组件渲染的时候给表单赋初值。//data中定义是空对象:serviceDetail:{},// 初始化 init(){ if(this.moduleType == 'module'){ this.moduleDetail = { name: '', userId:JSON.pars.
2021-08-30 11:31:23 1200
原创 vue + canvas绘制背景图、矩形
最近有需求做图片人脸识别,在系统上传图片后,后台返回坐标将识别到的人脸画上矩形。效果图如下:实现过程:1、利用绘制canvas实例//html<canvas id='imgCanvas' ref='imgCanvas'></canvas>//js this.canvas = this.$refs.imgCanvas; this.canvas.height = this.$refs.picContainer.offsetHeight; this.ctx = th.
2021-07-08 16:41:16 3777 1
原创 vue项目中使用element组件,修改样式不生效
今天遇到一个很蠢的问题,用element的slider滑块做一个量杯似的刻度线,修改样式的时候一直不生效。我在自己写的组件上加了scope,表示当前组件中生效,引入的组件库的组件使用时,直接给组件加类名,改变样式是不生效的。引入组件已经成为子组件了,不能加scope。去掉scope就立即生效了。...
2021-06-04 18:23:42 796
原创 video视频直播总结(m3u8格式、flv格式)
1、视频播放标签videovideo属性和方法的可以在网上直接找,链接菜鸟教程如果是MP4格式的视频,可以用video标签直接播放,其属性可以直接用,这个格式视频一般是静态的资源,可能是本地也可能是服务器上。<video class="video-img" :src="url" controls="controls"></video>//url即视频地址2、m3u8格式视频流播放该格式需要安装videojs与video标签结合播放//html代码<vid
2021-05-28 18:22:36 10601
原创 vue-video-player视频播放及全屏添加信息在视频上
一、vue-video-player实现视频播放安装vue-video-player插件vue-video-player和videojs-contrib-hls后者是播放播放m3u8格式视频流。在main.js中引入注入到全局const hls = require("videojs-contrib-hls") ;Vue.use(hls)将css文件引入import "video.js/dist/video-js.css";import "vue-video-player/src/custom-the
2021-05-20 10:19:06 3443
原创 element弹框loading
弹框有两种插入模式,一种是基于写弹框的页面元素上,一种是插入至 body 元素上。无论是哪种方式,在弹框请求数据渲染页面时,如果直接给弹框加loading,第一次渲染loading位置不对。如下图loading的层级在弹框的下面原因:loading一般加在弹框body内元素上,第一次渲染弹框body未找到就会加在弹框的最外层元素上,那层级自然不对。解决方法:打开弹框后,再元素渲染后去打开loading this.$nextTick(() => { openLoading.
2021-04-06 14:47:16 6464 1
原创 vue 子组件修改props方法
vue是单向数据流,父组件通过props传值给子组件,如果在子组件中修改会报错,一般是不在子组件中修改props的,但偶尔有需要在子组件有修改props,这里介绍三种可以修改子组件props的方法。1.父组件用sync修饰,子组件通过$emit('update:参数',值)函数去修改。在项目中通常可以用改方法关闭弹框。<template> <el-dialog title="提示" :visible.sync="centerDialogVisible"
2021-03-07 20:53:36 15466
原创 element loading二次封装
根据element官网,loading的配置项如下:根据这些配置项将loading的打开和关闭封装成方法,可以将方法注入vue的原型中,也可以在使用的时候引入。* @param {obj} target:需要添加loading的对象可以是string(单个)、arr(多个); * Loading的使用方法: * 在页面中引入Loading的公共方法 * 在页面中使用格式为openLoading({ scope: this,
2021-01-14 20:09:24 1165 1
原创 element日历组件---值班计划(动态数据渲染及头部样式)
根据element组件封装后的日历组件如下图所示,根据后台数据渲染值班计划和双击日期对该日期排班。首先是改造头部,由于element日历组件并不满足所需功能,将element源码进行改造封装。代码如下<!-- 这是改造后的代码 --><div class="el-calendar__header"> <span class="last" @click="selectDate('prev-month')" ><i class=".
2021-01-14 19:59:27 3967 2
原创 面试之---js
[typeof null, null instanceof Object]的结果?1、typeof A 返回结果是A的类型。主要是由6种(number、string、undefined、boolean、function、object)typeof undefined;//undefinedtypeof 'abc';//stringtypeof 123;//numbertypeof true;//booleantypeof {};//objecttypeof [];//objecttyp.
2020-12-12 22:02:24 107
原创 面试之---css基础
常用的选择器id、class、标签选择器、伪类选择器、nth选择器、子元素选择器(E>F)、后代选择器(E F)实现单行文字居中、多行文字居左display:flex;justify-content:center.word { width: 500px; margin: 20px auto 0; border: 1px solid #ccc; display: flex; justify-content: ce.
2020-12-12 20:42:22 128
原创 2020,年末离职的一些感悟
说来残忍,在2020年这样一个特殊的年份,在年末我离职了。许多人都说在年前离职并不是一个明智的选择,但事实已定,就要向前看。2020年的这一年来的工作做下总结,主要从技能和生活、学习三个方面:‘技能’这个词,在我之前的认知是身为程序员其专业技能和业务能力的相辅相成,一弱一强的排列组合也不失为两条比较长和可选择的发展方向。但在我离职的那个晚上,‘技能’这个词反复在我的脑海中出现,它被重新定义。在一个集体中,不过集体是大还是小,既然设定了不同的职位,各司其职是必然的每一个岗位上都有自己需要的技能,.
2020-12-12 16:48:40 319
原创 2020年的小尾巴
转眼2020年就只剩最后一个月了,在没有工作之前总在幻想自己工作后的样子,而工作近一年的自己很想对那时候的我说,不要害怕,勇敢的做出决定,至少没有后悔过。今年是特别的一年,从学校的象牙塔走入社会,在学校里只需要学习好就可以了,在工作中却是什么都要去学,通过今年的工作状态,总结下自己的不足:1*执行力不高。这个在工作中体现的很明显,对于老板安排的工作没有立即执行,不知道自己在害怕什么,有时候像是害怕与人打交道似的。在今后不论是与人相处还是工作中/生活中要提高自己的执行力,特别是工作上,安排到就要立即去执.
2020-11-28 21:50:33 214 2
原创 懒加载级联选择级(多选)及其回显
最近有个需求:懒加载三级行政区域,而且可以进行多选,其中涉及它的回显比较麻烦,级联选择器多选出来的结果是一个二维数组,要对这个二维数组回显,而拿到回显的数据是最后一级数据组成的数组。具体的需求如下:级联选择器在弹框中,用户在弹框中选择的结果放在页面组件中(选择的label和value)显示label,将value传给后台。再次点击弹框时,需要回显用户的选择,同时在页面组件中用户是可以删除某个选中的行 政区域的。1、懒加载三级行政区域级联选择器,先默认请求第一级(省级行政区域),然后懒加载二三级
2020-11-01 15:31:45 3592 8
原创 vue动态路由跳转
vue动态路由跳转有push、replace等方法。最近有个需求是需要从不同的路由点击某个操作按钮进行路由跳转。之前用的是replace方法,因为要带参数,想到的办法是用模板字符串把所有的参数拼接在地址栏上传参过去。this.$router.replace( { '/service/intelligentAlarmDetail?alarmType='+alarmType+ '&a.
2020-09-20 15:03:12 1640
原创 js数组常用方法
1、splice() 方法用于添加或删除数组中的元素。在项目中用得最多的是截取数组中某项,改变原数组2、toString() 方法可把数组转换为字符串,并返回结果。不改变原数组3、join() 方法用于把数组中的所有元素转换一个字符串。元素是通过指定的分隔符进行分隔的。不改变原数组4、slice(),语法:arrayObject.slice(start,end)必需。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类.
2020-09-14 21:44:16 227
原创 input的antocomplete在Chrome中失效
在做vue项目的时候结合了element框架,根据项目需求,不希望在input框中用户名和密码自动填充,但不知道为什么原生的antocomplete属性在Chrome中失效,没有解决这个问题。百度方案:1.先将input的type改成text,在获取了input框焦点的时候将type改为password,但这个方法没有起效果,不知道是不是我没有用对。2、修改Chrome的配置,这个我没有找到怎么做目前还在解决这个问题中。。。。...
2020-09-05 17:21:13 229
原创 思考与感悟(2020.9.5)
从2020.2月开始工作到现在有8个月了,这8个月是我从懵懵懂懂初入职场新人和空有理论知识的学生党到渐渐明白职场规则和培养了一定实践经验职场人。引发了我对未来的诸多思考,我思考着:程序员的职业生涯短暂?职场新人工资低?没有经手项目是不可能有项目经验的,然后当有了一定经验时,已不再年轻,不愿意身体也不允许再像年轻时那么潇洒不羁,我又该何去何从。而这个时间段是很短暂的,就仅仅只有5年时间,30岁就是一个分水岭,这是一个很现实的问题,那时候我该怎么办,我需要其他的技能来填充和维持生活。说白了就是要在30岁之前
2020-09-05 17:13:21 285
原创 8月份总结
工作:这个月开启了新项目,刚刚开始的时候对业务的理解不够,导致一直都做得很差,那一两个周过得比较忙碌、疲惫、沮丧。好歹熬过去了,渐渐地往好的方向发展,项目也越做越顺。虽然这个项目和上半年的项目重合比较多,多数代码是copy过来直接用的,正是因为这次copy,看到了很多之前做的逻辑混乱、代码冗余,样式写的不对。有这次机会,让项目重新来一次,正好借着这次机会,整理自己的思路、逻辑,化繁为简。这也是一次成长的机会,相信经过这次重新整理能助我成长不少。比较苦恼的是,在工作之余技术提升这方面我做的很少,每次打开
2020-09-01 12:57:00 192
原创 读《变量2》的小感悟
每个周末最惬意的事就是窝在沙发上阅读,这时候时间、空间都属于我,如果能恰好读到与自己产生共鸣的文字,变感觉整个人浑身舒畅、每个细胞都在发出叹慰!呜呜,太喜欢这种感觉了。这个周读了《变量2》,这是一个系列丛书,作者是经济学家何帆老师,他承诺这个系列会写30本,每年出版一本,从2018年开始。这个系列记录中国经济发展的30年变化,作者从社会的热点,以小见大,将事物放到社会发展的历史洪流中,从小变量、小趋势分析和观察我们所处的位置,大到全球经济发展格局,小到个人所处经济环境、社会环境。我今年以来比较喜欢阅读.
2020-08-09 17:57:30 282
原创 element-ui树形组件做权限管理
最近新开了个项目,不巧的是我又要做菜单权限控制这块,再次使用element tree组件,我这次在获取角色权限时直接使用tree组件封装的方法:this.rightIds = [ ...this.$refs.rightTree.getCheckedKeys(), ...this.$refs.rightTree.getHalfCheckedKeys() ];获取tree上勾选和半勾选的菜单即可。想起上次在tree上加了个change事件,每次都会重复获取之前已经取得的key,很老火,唉。。。。。当时没有想.
2020-07-29 12:51:40 2358
原创 flex布局,左右两端固定,中间自适应且超出隐藏
这几个月来,在样式上备受打击,感觉自己css都不会写。有需求要flex布局,左右两端固定,中间自适应且超出隐藏,我百度加自己整理下,记录下来。这个是flex布局,左右两端固定,中间自适应//html代码<div class="parent"> <div class="left"><div> <div class="center"><div> <div class="right"><div>//css代码.p
2020-07-01 20:17:53 3905 4
原创 控制鼠标滚轮事件触发次数
在一个需求中,需要根据业务触发鼠标滚轮事件,在某些时候不触发该事件。@mousewheel="eventBtn && handleScroll($event)", 当eventBtn为false时不触发,当eventBtn为true时触发。
2020-07-01 18:55:44 1245
原创 echarts使用之饼图
公司数据可视化项目需要大量的用到echarts图表,今天总结下饼图的使用。参照echarts官方文档,三步走1、引入echarts :import echarts from “echarts”;2、准备一个盒子3、初始化echarts模型下面是完整的代码<template> <div class="pie-chart"></div></template><script>import echarts from "echa
2020-06-20 17:52:28 1156 1
原创 vue中watch与computed的性能哪个好
最近有需求在组件1中获取详情后传到另组件2中去使用,我是在组件1中发请求拿到想要的数据,用一个变量传到组件2中去,在组件2中同样定义一个相同的变量,同时用watch监听这个变量的改变,将变量里的值绑定到页面上去。但感觉watch不应该做这么多的事,有什么更好的解决方法呢?????...
2020-04-30 20:38:40 2488 1
原创 利用FTP上传工具上传代码
工具:FlashFXP步骤:1、新建站点2、配置站点地址及端口(一般是公司局域网)3、将打包好的dist目录下的所有文件,将其上传
2020-04-30 20:10:56 392
原创 vue过渡与动画( transition标签)
Vue的动画并没有非常炫酷的效果,不过也是有一些实用性的,在项目中有的地方使用,也是能够营造出不同的效果。
2020-03-13 22:46:44 456
原创 element中使用带图标日期选择器
在element中使用带图标日期选择器组件,该组件只提供了图标在头部位置,如果我们想要修改图标位置可以给icon加text-align:right/left
2020-03-02 12:26:05 3685
原创 vue的Methods和Computed
1、El 元素节点el为element的缩写,表示绑定DOM元素节点,该DOM的元素的绑定就类似于选择器,<div id="app"> <p></p> <p></p></div><script>//这样就绑定了大盒子divvar vue=new Vue({el:"#app"})<...
2020-02-27 21:46:55 253
原创 git的使用
1、git是什么?git是分布式版本管理工具开发者:Linux系统的作者–Linus Torvaldsgit下载地址2、配置用户名和邮箱(1) 配置身份,设置用户名与邮箱 git config --global user.name "username" git config --global user.email "your email"(2) 查看配置的用户名和邮箱(和设置...
2020-02-25 21:58:05 203
原创 基于node微信公众号开发(1)
记录我开发的第一个微信公众号,对于咱们前端来说,用node开发微信公众号是最省力的,虽然node是js的运行环境,但node是用JavaScript编写的,更易于理解。1、微信公众号介绍微信公众平台提供了编辑模式和开发模式:通过编辑模式实现文字,语音,图片,图文消息的自动回复和关键词自动回复。不会开发的人、自媒体也可以打造自己的微信公公号。开发模式是对微信公众平台的二次开发,使用微信公众平...
2020-02-24 11:41:40 390 1
原创 鸡汤:发表文章参考文献标准格式
如果要在很正式的一些期刊或者是学术网站上发表自己的文章,尤其是咱们做技术通常是会做东西但写点 什么文字就特别恼火,所以可以通常大量的参考别人的文章:取其精华去其糟粕,但在参考别人文章是应 该要把参考文献上,这边写几个常见参考文献类型的标准格式。(1)期刊[序号] 主要作者.文献题名[J].刊名,出版年份,卷号(期号):起止页码.例如: [1] 袁庆龙,候文义.Ni-P 合金镀...
2020-02-22 17:31:54 317
原创 重置样式与公共样式
在这里整理些PC端会用到的重置样式与公共样式:1、重置样式html { line-height: 1.15; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */}body { margin: 0;}article,aside,foote...
2020-02-20 10:19:36 437
原创 websocket的原理及使用
1、为什么要使用websocket很多人疑惑有http,为什么要使用websocket?因为http是超文本传输协议,的通信只能有客户端发起其连接如图下:如果服务器有连续的状态变化,客户端要获知就非常麻烦,可以采用轮询的方式(客户端每隔一段时间就向服务器发起请求),但这种方式很耗资源,效率较低。2、websocket的简介websocket是HTML5新增的一种基于TCP协议的网络通信...
2020-02-19 13:54:50 489
原创 如何购买服务器及域名(阿里)
分享下我在阿里购买服务器及域名的过程,虽然官网有说明,但对于第一次购买的人来说还是有些地方蒙圈或者是找不到正确的说明地方,所以想记录下来,希望能帮到想买服务器和域名的小伙伴。1、购买服务器购买服务器比较简单:进入阿里云官网,登录阿里云账号(没有可以先注册),选择你需要的服务器,选择低于和镜像还有购买时间,购买支付即可,如下图:注意:根据国家相关规定,大陆境内的服务器需要备案才能访问...
2020-02-15 21:30:38 3504 2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人