
javascript
YoungDoCui
这个作者很懒,什么都没留下…
展开
-
vue3.2 + elementplus 2.+构建项目兼容chrome49存在的问题
一. 使用vue3.2 + elementplus 1. 尝试发现:el-cascader 筛选插件点击无响应且表单样式错乱解决方案:换elementplus2.+二. 使用vue3.2 + elementplus 2. +尝试发现:el-cascader 可以使用但是2重构了很多样式,例如已知1是使用broder做的input的边框,2采用了box-shodow,其中box-shodow中使用var嵌套的写法貌似在chrome49不兼容解决方案:先重写了一些使用box-shodow的组件样式原创 2022-07-05 20:09:14 · 3824 阅读 · 3 评论 -
浅谈ssr
原创 2022-04-13 20:32:10 · 250 阅读 · 0 评论 -
根据后端传入颜色,前端实现主题色的切换,结合websocket,可以实现前端根据天气,黑夜白天动态切换主题颜色,当用户查看网站时,使用动画过渡切换颜色
element、vant已经成功实现demo:我给ws写了个轮询测试主要是看了element-admin实现的切换皮肤,刚好有个手机端有这种需求,除了是后端传入,看了下,还真能实现主要思路就是通过less或sass 修改默认颜色 例如vant的默认颜色是@white,通过export导出存入vuex,修改vuex触发事件请求云端的同版本css,然后正则将默认颜色改成配置好的颜色,放入head的style中,这是element的思路,真的太骚了。具体实现(vant):1.首先我的ws,随便写的c原创 2022-04-13 20:08:51 · 2392 阅读 · 0 评论 -
初识vue3
以前面试总是从方面说vue3采用了es6的proxy进行对数据的检测,其实vue3小变动还是挺多的-vue2-vue3created 和beforeCreatedsetupcomputedcomputedmoutedonMounted(()=>{})this.$refrefwatchwatch(()=>x,(new,old)=>{})\watchEffect(()=>{}) 监听数据不需要写明监听谁data ret原创 2022-03-03 14:38:57 · 743 阅读 · 0 评论 -
Angular初识
与vue不同的是ng使用了ts做语法支持,vue还没有说非ts不可,我是觉得它有react类组件的样子,也有vue指令的影子-angluar-vue*ngForv-for*ngIfv-if(click)@click[msg]=“msg”:msg=‘msg’#appSons@\appSons=’#appSons’*ngSwitch\[(ngModel)]v-model[ngClass]、[ngStyle]:class、:style原创 2022-03-03 13:17:34 · 417 阅读 · 0 评论 -
devServer中before设置mock与真实后端会产生bug
devServer中before设置mock与真实后端会产生bug原创 2022-02-16 10:54:06 · 2148 阅读 · 2 评论 -
VUE制作标签页面,重复点击报错:Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation 问题
应该是router版本太高的问题如果是push方法,在router文件里的index.js加入const VueRouterPush = Router.prototype.pushRouter.prototype.push = function push (to) { return VueRouterPush.call(this, to).catch(err => err)}如果是replace方法,在点击方法中加入(自行更改判断条件)itemClick(){ if(th原创 2021-02-20 11:49:22 · 184 阅读 · 0 评论 -
浅谈前端渲染和后端渲染
什么是前端渲染 什么是后端渲染顾名思义 数据在后端渲染完毕后才传给前端叫做后端渲染,这个方式存在于jsp/php时代后端路由:后端处理url和页面之间的映射关系这种情况下渲染好的页面不需要单独加载css和js,直接在浏览器中显示,有利于seo优化直到出现ajax,前后端开始分离,前端渲染就是前端通过js文件执行获取后端的数据然后渲染到页面上,这种方式是前端渲染前端路由:用来管理页面,每一个url管理一个页面组件spa页面 一般情况下整个项目只有一个html页面 它最大的原创 2021-02-20 11:40:18 · 452 阅读 · 1 评论 -
浅谈vue生命周期的理解
什么时生命周期一个事物从诞生到消亡,vue的生命周期就是 vue从创建到销毁之间的各种事件也可以说是生命周期钩子创建时候的生命周期函数=》运行期间的生命周期函数=》销毁期间的生命周期函数首先vue在new之后会先初始化事件和生命周期函数,然后遇到第一个生命周期函数beforeCreate,意味着示例创建完毕,但是这个时候data和methods都没有被初始化遇到的第二个生命周期函数是created,这时候data和methods都被初始化了,如果要调用方法或数据,最早只能在这里接下来vue开始进原创 2021-02-20 11:34:10 · 166 阅读 · 0 评论 -
JS实现侧边栏点击回到指定位置的功能
DEMO代码写的不太好,大佬可以帮忙修改修改哈<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head>&.原创 2021-01-10 16:04:52 · 1034 阅读 · 4 评论 -
使用js完成简单的切换标签功能
使用js完成简单的切换标签页功能1.话不多说,咱先上demo,写的比较随便,二三界面并没有完善,但是主要咱们看功能,我这里写的是手机项目,基本这种需求也就是手机界面比较常见,其实纯css也能实现上图中所有的动态效果,我之前写过一篇css切换标签页的文章,有需要的可以去看看,轮播图以后也会出一篇css与js的文章2.首先css我不多说了,起名要有顺序 关键的地方我在下面标注下一共6张图片 3张点击前的 3张点击后的三张点击前图片我的命名方式都是从1到3 方便for循环遍历到三张点击后的图片也是如此原创 2020-12-23 23:21:07 · 1386 阅读 · 0 评论 -
js中this指向的判断方式
js中this指向的判断方式在全局中的this指向的window在箭头函数中如果没有this使用的上一层的this在function中的this 谁触发了函数指向谁构造函数中的this new触发了函数 指向的是实例化的对象 如下指向是resvar res= new Psersoncall bind apply触发的 指向参一foo.bind(obj2)指向obj2但没有执行函数foo.bind(obj2)()指向obj2且执行函数obj.foo.apply(obj原创 2020-12-18 19:19:53 · 208 阅读 · 0 评论 -
作用域,作用域链,执行上下文,执行上下文栈的理解
作用域,作用域链,执行上下文,执行上下文栈的理解在学习作用域,作用域链,执行上下文,执行上下文栈等概念时,发现有很多概念很相似,顾产生了一些混淆,写此篇文章旨为梳理一下js引擎的执行顺序,理清一些概念,可能文章会有一些错误,望理解与改正首先理解一下层级关系 在运行代码前会产生【准备工作】,就是创建执行上下文,执行上下文存在【作用域链】,变量对象AO/GO、this指向,所以我们知道了作用域链是在执行上下文产生后,函数运行前产生的,先不管作用域链,我们回到执行上下文,执行上下文首先会遇到全局创建全局执行原创 2020-12-17 23:28:57 · 279 阅读 · 1 评论 -
浅谈深浅拷贝
深浅拷贝的区别深拷贝和浅拷贝的区别深拷贝不会改变原来的元素,浅拷贝改变原数据或者拷贝后的数据,另一个数据都会发生改变深拷贝和浅拷贝分别发生在哪里深拷贝发生在基本类型中浅拷贝发生在引用类型中为什么会造成深浅拷贝因为基本类型的数据存放在栈中,可以理解为每一个元素对应一个房间,改变一个元素的内容并不会影响到另一个房间内元素的内容引用类型的数据则不同,存放在堆中,堆中存放的是数据仅仅是在在栈中进行了引用,并没有改变原房间内的内容,指向的数据源是同一个,想要深拷贝引用数据,只能在内存中开辟一个新的原创 2020-12-10 20:18:37 · 137 阅读 · 0 评论 -
封装一个方法(获取自定义格式的时间)
封装一个方法(获取自定义格式的时间)// 日期格式化方法// package_data_format/** * @param {YYYY-MM-DD hh:mm:ss} fotmat */function package_data_format(fotmat) { var nowData = new Date() var dateobj = { YYYY: nowData.getFullYear(), MM: nowData.getMonth(),原创 2020-12-10 20:02:22 · 226 阅读 · 1 评论 -
js排序的几种方法
js排序的几种方法使用sort进行排序 var arr = [1,2,4,6,4,6,3,6,8,54,4,565,54] var res = arr.sort(function(a,b){ return a-b }) console.log(res) // sort 降序 var res2 = arr.sort(function(a,b){ return b原创 2020-12-10 19:55:22 · 420 阅读 · 0 评论 -
使用js获取当前时间且按照格式输出
使用js获取当前时间且按照格式输出1.首先先创建一个对象存放所有获取的时间var date = new Date();var obj = {YYYY:date.getFullYear(), //获取了年 对应key:YYYYMM:date.getMonth()+1, //获取了月 对应key:MMDD:date.getDate(), //获取了日 对应key:DDhh:date.getHours(), //获取了时 对应key:hhmm:date.getMinut原创 2020-12-03 19:57:36 · 2196 阅读 · 0 评论 -
使用js实现验证码功能
使用js实现验证码功能通过随机数可以做到生成随机数的功能如果设定了一段固定的字符串,通过随机数确立可以确定随机索引值,那么就可以生成特定数据内的随机数实现:定义数组:var str =‘abcdefghijklmnopqrstuvwxyz1234567890’;定义存放验证码的变量: var res ="";for(i<0;i<6;i++){// 需要几位随机数就循环多少次var a =parseInt( Math.random()*str.length)//parseInt原创 2020-12-03 19:36:21 · 1304 阅读 · 0 评论 -
js基础:使用AO和GO判断执行顺序
使用AO和GO判断执行顺序一.首先理解全局变量和暗示全局变量1.全局变量:含有声明的变量eg:var a = 10;2.暗示全局变量:不含有声明就赋值的变量eg:a = 10;二.其次理解全局变量和局部变量1.全局变量:函数体外声明的变量称为全局变量2.局部变量:函数体内声明的变量称为局部变量三.知道AO的执行顺序AO用来判断函数体内的执行顺序,通常分为四个步骤1)首先创建AO对象(执行期上下文)2)找到形参和变量声明,将变量与形参名作为AO属性名,值为undefined3)将实参原创 2020-11-25 23:34:00 · 397 阅读 · 0 评论