2019年8月19日
Vue运行后出现5位数随机端口号
摘要： npm install portfinder@1.0.21 阅读全文
posted @ 2019-08-19 20:16 绿谷 阅读(475) 评论(0) 推荐(0)
2019年8月16日
vue项目打包后背景图路径多了/css/static
摘要： 在build/utils.js文件中添加publicPath:'../../' 阅读全文
posted @ 2019-08-16 20:24 绿谷 阅读(1663) 评论(0) 推荐(0)
手机UC浏览器图片无法超出父块并隐藏
摘要： 用div代替图片，并将图片设为背景 阅读全文
posted @ 2019-08-16 20:21 绿谷 阅读(198) 评论(0) 推荐(0)
2019年8月15日
vue图片懒加载使用本地图片
摘要： Vue.use(Lazyload, { error: require('./assets/img/noimg.jpg') }) 阅读全文
posted @ 2019-08-15 21:18 绿谷 阅读(909) 评论(0) 推荐(0)
图片居中并超出隐藏
摘要： .img-box{ width: 100px; height: 100px; overflow: hidden; display: flex; justify-content: center; align-items: center; } 阅读全文
posted @ 2019-08-15 21:12 绿谷 阅读(478) 评论(0) 推荐(0)
2019年8月11日
在Vue中使用better-scroll实现横向滚动和竖向滚动
摘要： npm install better-scroll --save <template> <div class="box"> <div class="person-wrap" ref="personWrap"> <ul class="person-list" ref="li1"> <li class="person-item" :class="{'current':currentIndex inde 阅读全文
posted @ 2019-08-11 16:46 绿谷 阅读(6864) 评论(0) 推荐(0)
Vue实现动画的几种方式
摘要： 1. vue内置组件transition 元素出现和消失都呈现动画 2. animate.css插件 参照https://github.com/daneden/animate.css 加入类名时呈现动画 3. wow.js 需引入animate，滚动到元素的位置展现动画 4. 原生css动画 阅读全文
posted @ 2019-08-11 16:24 绿谷 阅读(10197) 评论(0) 推荐(0)
scss同时使用两个数组
摘要： <div class="content"> <div v-for="(item,index) in 5" :key="index" :class="`box box${index}`"></div> </div> <style lang='scss' scoped> .content{ position: relative; } .box{ position: absolute; width: 5 阅读全文
posted @ 2019-08-11 16:06 绿谷 阅读(835) 评论(0) 推荐(0)
ul li横放时有4px空隙
摘要： ul{ list-style-type: none; } .li1{ float: left; width: 50px; background-color: aqua; } .li2{ display: inline-block; width: 50px; background-color: aqua; } 123 1234 ... 阅读全文
posted @ 2019-08-11 15:46 绿谷 阅读(284) 评论(0) 推荐(0)
2019年8月6日
js鼠标事件onmouseover与onmouseout多次触发
摘要： 原因：冒泡和捕获 建议使用onmouseenter与onmouseleave代替 阅读全文
posted @ 2019-08-06 20:53 绿谷 阅读(1347) 评论(0) 推荐(0)