前端
张媛的博客
热爱生活!热爱前端!— — 知其然 知其所以然 知其必然
展开
-
时间戳、中国标准时间、年月日三种时间格式转换
格式: 1649462400000-格式: Sat Apr 09 2022 08:00:00 GMT+0800 (中国标准时间)-格式: 2022-04-09时间戳转换成中国标准时间中国标准时间转换成年月日年月日转换成时间戳。转载 2022-12-02 09:40:02 · 4172 阅读 · 0 评论 -
Object.fromEntries()
Object.fromEntries() 使用详解转载 2022-11-30 13:58:52 · 234 阅读 · 0 评论 -
vue 网络图片转Base64
【代码】vue 网络图片转Base64。原创 2022-11-16 14:53:55 · 915 阅读 · 0 评论 -
el-dialog固定高度
现在要实现一种窗口高度固定,内容滚动的方式,如下直接在内容上套一层div并加上自定义样式el-dialog-div。默认高度是自由拉伸的,当内容超过屏幕时会出现滚动条,按钮和标题都会随着滚动,用户体验不好。原创 2022-11-15 17:38:27 · 16326 阅读 · 0 评论 -
vue中三种for循环方式
vue中三种for循环方式转载 2022-11-02 09:13:17 · 340 阅读 · 0 评论 -
eS6常用语法
eS6常用语法吐槽:或者吐槽:“不会用ES6的解构赋值来取值吗?5行代码用1行代码搞定不香吗?直接用对象名加属性名去取值,要是对象名短还好,很长呢?搞得代码中到处都是这个对象名。”改进:反驳不是不用ES6的解构赋值,而是服务端返回的数据对象中的属性名不是我想要的,这样取值,不是还得重新创建个遍历赋值。吐槽看来你对ES6的解构赋值掌握的还是不够彻底。如果想创建的变量名和对象的属性名不一致,可以这么写:补充ES6的解构赋值虽然好用。但是要注意解构的对象不...原创 2022-06-29 15:30:25 · 1217 阅读 · 5 评论 -
uniapp页面置顶(悬浮按钮置顶操作)
uniapp页面置顶(悬浮按钮置顶操作)原创 2022-06-22 17:51:57 · 1840 阅读 · 0 评论 -
适配iPhoneX底部小黑线,CSS一招搞定!
适配iPhoneX底部小黑线,CSS一招搞定原创 2022-06-21 14:51:03 · 387 阅读 · 0 评论 -
深拷贝、浅拷贝区别,实现深拷贝的方法
如何区分深拷贝与浅拷贝,简单点来说,就是假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟着变了,说明这是浅拷贝,拿人手短,如果B没变,那就是深拷贝,自食其力。此篇文章中也会简单阐述到栈堆,基本数据类型与引用数据类型,因为这些概念能更好的让你理解深拷贝与浅拷贝。我们来举个浅拷贝例子:嗯?明明b复制了a,为啥修改数组a,数组b也跟着变了,这里我不禁陷入了沉思。那么这里,就得引入基本数据类型与引用数据类型的概念了。面试常问,基本数据类型有哪些,number,string,boolean,null,转载 2022-06-07 15:59:36 · 270 阅读 · 0 评论 -
uniapp项目运行时一直发http://localhost:8080/sockjs-node/info?t=1462183700002请求
或者完事之后重跑(重新运行)项目原创 2022-05-31 10:41:39 · 2376 阅读 · 3 评论 -
ES6-ES13常用语法记录
一、检测是否为数组 1、instanceof方法 const arr = new Array() // const arr = [] arr instanceof Array //true 2、constructor属性 返回对象相对应的构造函数。 3、isArray()方法 const arr = new Arr...原创 2022-05-30 15:39:49 · 344 阅读 · 0 评论 -
ES6数组去重、交集、并集、差集的使用
ES6数组去重、交集、并集、差集的使用原创 2022-05-26 10:37:14 · 706 阅读 · 0 评论 -
多行文字、单行文字限制行数 超出用...表示
第一种方式:多行、单行都可text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2; //可展示几行-webkit-box-orient: vertical;第二种方式:单行overflow: hidden;text-overflow:ellipsis;white-space: nowrap;原创 2022-05-18 16:46:13 · 226 阅读 · 0 评论 -
如何判断对象是否为空
1、对象转化为字符串进行比较var a={}; var b=new Object();console.log(JSON.stringify(a)=="{}") //trueconsole.log(JSON.stringify(b)=="{}") //true2、for...in循环var a={};function isEmptyObject(obj){ for(var key in obj){ return false }; return...转载 2022-05-13 14:45:00 · 1255 阅读 · 0 评论 -
vue 清除字符串中的空格
一般如果是输入框的话,直接禁用空格即可,我们已知的可能是直接调用trim方法即可,但是在使用element ui 时,可以直接在输入框上设置trim,会比提交后再调用trim方法实用的多<el-input v-model.trim="value"></el-input>如上图所示,直接在v-model上加trim输入框就无法输入空格了当然如果非要用正则方式去去除空格也是可以的方法如下图所示clearBlank(value){ if(value){ ...转载 2022-04-15 18:45:00 · 8061 阅读 · 0 评论 -
css设置图片适配:显示中间部分(居中显示)
给对应的图片设置样式{width: 100%;height: 100%;object-fit: cover;object-position: center;}原创 2022-04-13 17:34:45 · 1085 阅读 · 0 评论 -
uniapp 顶部滑动状态栏加背景色
<view :style="{ height: iStatusBarHeight + 'px'}" class="stat" v-show="isShowBarHeight"></view>变量isShowBarHeight:false, // 头部是否展示背景色iStatusBarHeight:0,方法onPageScroll(e) { // 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件 if(e.scrol.原创 2022-04-01 10:54:15 · 1471 阅读 · 0 评论 -
如何在h5和小程序中适配iphone X全面屏底部的安全区
1、第一步: h5需要设置页面属性: <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no,viewport-fit=cover">在属性样式上加一段判断覆盖样式:示例代码:.load-more { color: #0080ff; padding-bottom: 32px;}@supports (bottom: c...转载 2022-03-30 15:00:43 · 846 阅读 · 0 评论 -
响应式页面
概念:响应式网站设计是一种网络页面设计布局,其理念是:集中创建页面的图片排版大小,可以智能地根据用户行为以及使用的设备环境进行相对应的布局。多使用 max-width、min-width,不写死宽度; 使用 media 查询来响应不同分辨率; 使用动态 REM 方案保证手机端的显示效果; 响应式图片; 字体最好不要用绝对大小 (px),而使用相对大小 (em)相比自适应页面:自适应页面(流体布局、fluid layout)指的是页面宽度不固定。跟响应式页面没有什么关系。自适应页转载 2021-10-20 22:00:00 · 323 阅读 · 0 评论 -
Vue基础知识总结(二)
8、vue插槽8.1、案例1(了解插槽):父组件:mytest.vue <template> <div> <div>大家好我是父组件</div> </div> <myslot> <p>测试一下吧~内容在这里显示</p> </myslot> </template> <script>...原创 2021-05-29 15:05:40 · 177 阅读 · 1 评论 -
织梦在前端每次循环获取+1
[field:global name=autoindex runphp="yes"]@me=@me+1;[/field:global] {dede:global name=itemindex runphp="yes"}@me=@me+1;{/dede:global}autoindex itemindex 的使用心得区别 channelartlist 标签下使用 {dede:glo...原创 2018-12-03 15:31:44 · 318 阅读 · 0 评论 -
常见浏览器兼容性问题与解决方案
常见浏览器兼容性问题与解决方案 所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况。在大多数情况下,我们的需求是,无论用户用什么浏览器来查看我们的网站或者登陆我们的系统,都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题。 在学习浏览器兼容性之前,我想把前端开发人员划分为两类: 第一类是精确按照...原创 2018-11-19 18:09:18 · 275 阅读 · 0 评论