![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
web前端
文章平均质量分 51
「已注销」
这个作者很懒,什么都没留下…
展开
-
使用vue-awesome-swiper插件时遇到过的问题
1. 安装vue-awesome-swiper时不要作死安装最新版本,不然你会调bug调到裂开!进入vue-awesome-swiper的npm网页中时不要安装下图的版本安装这个版本你会发现它不会给你安装swiper文件夹(必要的css等文件的文件夹),不管你重新执行下列安装指令都不会给你安装swiper文件夹!npm install vue-awesome-swiper --save然后在文档说明中又会让你引入swiper.css文件小朋友?你是不是有很多问号???我tm裂开了!!!解决方原创 2020-05-17 13:52:56 · 923 阅读 · 4 评论 -
Vue事件总线
背景我最近在练习Vue项目的时候使用better-scrollJavaScript库发现一个问题。使用better-scroll很容易出现,DOM渲染还没有完成better-scroll对象就已经完成了初始化,在计算高度时一些图片都还没有加载完成。这样就会造成滚动条不能滚动显示所有内容!解决的方法有在当前页面图片加载完成后更新一次滚动条。但是很多时候图片所在的组件离调用更新滚动条的组件会相...原创 2020-04-23 15:24:49 · 262 阅读 · 0 评论 -
vue项目底部导航栏的实现
vue cli4项目目录结构(操作后)项目配置路径别名配置新建一个vue.config.js文件module.exports = { configureWebpack: { resolve: { alias: { 'components': '@/components', 'content': 'components/content...原创 2020-04-21 18:24:47 · 789 阅读 · 0 评论 -
vue-router连续两次点击出错解决方法
当我们连续点击两次出现以下错误时:我这里亲测了一种成功的解决方式:安装新的vue-router版本npm i vue-router@3.0 -S 这里注意,安装完成后项目会报错。这时我们将项目关掉重新运行一次就可以了!...原创 2020-04-21 17:51:34 · 1929 阅读 · 1 评论 -
浅拷贝与深拷贝的实现
1. 实现浅拷贝1.1 ES6 object.assign()var newObj = object.assign(obj)1.2 ES6 展开运算符var newObj = {...obj}1.3 使用for…in循环拷贝function clone(obj) { if(!obj) return var newObj = obj.isArray(obj)? []:...原创 2020-04-11 12:33:40 · 137 阅读 · 0 评论 -
Event对象跨浏览器兼容性写法
var EventUtil = { addHandler: function(element, type, handler) { //绑定(添加)事件 //Chrome Firefox IE9等 addEventListener //IE8及IE8以下的浏览器 attachEvent if(element.addEventListener) { elem...原创 2020-04-11 12:00:14 · 123 阅读 · 0 评论 -
一张图解释VUE生命周期
原创 2020-04-08 23:47:49 · 112 阅读 · 0 评论 -
移动端屏幕适配
移动端适配移动端屏幕适配的作用是使页面在大小不一的移动端设配上都能正常的显示页面内容。在编写移动端代码是需要在HTML页面head标签中添加以下代码<head> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, ...原创 2020-04-08 13:46:07 · 667 阅读 · 0 评论 -
使用float实现响应式布局
栅格系统实现栅格系统的重要知识主要是媒体查询@media。栅格系统一行有多少列由你自己定义,这里我定义了12列。媒体查询的常用屏幕尺寸如下:栅格系统基础部分栅格系统的基础部分实现了基本的响应式功能,一行中的内容随着宽度的变化而改变布局。/*移动设备优先*//*es最小屏时*/.container{ width: 100%; /*实现容器container水平居中*...原创 2020-04-08 13:12:10 · 411 阅读 · 0 评论 -
原生JS实现兼容所有浏览器的事件处理对象
直接上代码<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Event对象跨浏览器兼容写法</title> </head> <body> <div id="parent"> <...原创 2020-04-08 12:24:23 · 195 阅读 · 0 评论 -
使用CSS实现img标签图片自适应正方形
我人比较懒,下面代码是我想象出来的。相当于商品简易展示块。像这样:代码如下:<a class="link"> <p class="pic"><img class="img" src="图片地址"></p> <p class="name">商品名称</p> <p class="info"> <...原创 2020-03-20 17:22:25 · 3083 阅读 · 0 评论