51dev.com IT技术开发者社区

51dev.com 技术开发者社区

Vue中scoped穿透

Vue中scoped穿透

1stylus的样式穿透使用>>>外层>>>第三方组件样式.wrapper>>>.swiper-pagination-bullet-activebackground:#fffsass和less的样式穿透使用/deep/外层/deep/第三方组件{样式}.wrappe...

vue 解决ie11兼容问题

vue 解决ie11兼容问题

一、ie11打开vue2.0项目空白,控制台报错vuexrequiresaPromisepolyfillinthisbrowserPromise为ES6语法,有的浏览器不支持ES6,所以需要安装babel-polyfill来将ES6转换为浏览器可识别的ES5语法①npminstall--save-devbabel-po...

vue中获取元素offsetHeight不包括IMG图片高度的解决方法

vue中获取元素offsetHeight不包括IMG图片高度的解决方法

今天在写一个组件的时候突然发现使用offsetHeight获取元素的高度总是不对,经过检查发现是缺少了元素中img的高度,这是为什么呢?这是因为图片加载需要时间,代码在获取div的offsetHeight的时候,图片还没有加载完成,所以得到的高度没有包含图片。解决办法有两个:1.在原生JS中将代码放在window.on...

vue中定时器的开启及关闭

vue中定时器的开启及关闭

今天在写一个滚动图片的功能,功能是这样的,页面加载后直接开始滚动,鼠标悬停停止滚动,鼠标离开再开始滚动。原理很简单,就是弄个定时器让元素.scrollLeft不断增加,鼠标移入时清除定时器,鼠标移除恢复定时器。但是在vue中就出现了一个小问题,在组件上使用@mouseenter="startRoll"...

vue使用laydate.js插件报错laydate.css: Invalid

vue使用laydate.js插件报错laydate.css: Invalid

在vue中使用laydate.js插件时可能会碰到laydate.css:Invalid这样子的一个报错然后导致laydate日期控件无法使用。这主要是因为laydate.js中引入的laydate.css这个文件没找到引起的。 解决方法先把laydate.css这个文件放到vue项目中的static文件夹,...

解决vue中使用laydate.js选择日期后再修改其他model时日期会被清空问题

解决vue中使用laydate.js选择日期后再修改其他model时日期会被清空问题

首先描述一下问题,下图中均绑定v-model,例如先选择出生开始时间,然后当再选择地区或其他选项时该时间就会被清空  首先看一下我这边开始的默认值,开始我设置都为空当我选择如下图的生日开始时间与结束时间后重新打印得到的结果如下发现虽然选择了时间,demo中也显示了日期,但是打印出来的实际的值确是空的...

vue项目多入口教程

vue项目多入口教程

小白入前端几个月,资历尚浅,希望不对地方,多多包涵在src目录下复制app内容创建test.vue,demo.vue,main.js复制main.js内容demo.js,test.js,修改一下内容在根目录下创建test.html,index.html指向demo(好像必须存在index,不然页面报错CannotGET...

vue实现标签云效果

vue实现标签云效果

最近想给自己的博客上加上一个3D标签云的效果,用来表示自己博客文章的分组,网上找到了canvas实现的,还有a元素实现的解析3D标签云,我想让标签可以选择和点击,又不想在标签数量较多时操作a标签导致性能问题,于是svg就成了一个不错的选择。这里实现的核心主要是参考了前面的那篇解析3D标签云的文章,作者给出了源码,讲解也...

vue学习笔记

vue学习笔记

一、安装, 需要安装node,npm,淘宝镜像cnpm,webpack,vue脚手架vue-cli下面是我的操作:nodewindow下升级到最新版本,去官网(https://nodejs.org/en/)下载最新稳定版本(v6.9.2)的.msi,替换到之前安装的node目录下,重新安装,安装成功node-...

vue 生命周期理解

vue 生命周期理解

先上一张生命周期的图:8个生命周期:beforeCreate:组件实例刚被创建,组件属性计算之前created:组件实例创建完成,属性已绑定,但DOM还未生成,$el属性还不存在beforeMount:模板编译/挂载之前mounted:模板编译/挂载之后beforeUpdate:组件更新之前updated:组件更新之后...

如何自己搭建一个vue脚手架工具

如何自己搭建一个vue脚手架工具

1.初始化项目目录 npminit(项目名称一定要规范否则会保存不能使用中文或者特殊符号)安装npmiwebpackvuevue-loader根据提示信息安装依赖npmicss-loadervue-template-compiler 2.新建文件夹(源目录)src在里面创建app.vue文件3.创建...

vue项目post请求405报错解决办法

vue项目post请求405报错解决办法

步骤一:  确定ajax语法没有错误。步骤二:  与后台对接确认请求是否打到nginx上?步骤三:  检查nginx是否配置了事件转发,比如我们的接口是在,当前地址的8100端口上,并且接口地址上有v1这个唯一标识,按照下图配置,即可解决此问题。...

vue引入echarts、找不到的图表引入方法、图表中的点击事件

vue引入echarts、找不到的图表引入方法、图表中的点击事件

1.在vue-cli项目中添加webpack配置,本文引入的最新版本。在 3.1.1 版本之前ECharts在npm上的package是非官方维护的,从 3.1.1 开始由官方 EFE 维护npm上ECharts和zrender的package。 使...

Vue问题1:TypeError:date.getHours is not a function

Vue问题1:TypeError:date.getHours is not a function

再用vue的时间控件的时候遇到了如下的问题:解决方法:在<el-date-picker></el-date-picker>时间控件加上value-format="yyyy-MM-dd"以防出现date.getTimesisnotafunction以下的applyTime设置为...

vue实现横向滚动效果(better-scroll)

vue实现横向滚动效果(better-scroll)

使用better-scroll实现滚动效果,参照大佬的文章,将better-scroll封装成组件可供多次调用。封装slider组件如何封装slider组件参考文档中解释的非常详细,但有一些细节可以提出。由于为横向滚动,首先需要一个宽度不变的wrapper,然后再制作一个较宽的content,content的宽度来源于...