Vue
@Grapefruit
要有遥不可及的梦想,也要有脚踏实地的本事
展开
-
vue + element-ui 使用ex-table-column插件实现el-table的内容自动撑开表格且不换行的功能
要有遥不可及的梦想,也要有脚踏实地的本事。----------- Grapefruit.Banuit Gang(香柚帮) 首先安装element-ui并实现引入,这个相信大家都会,柚子就不啰嗦了。 下面开始 第一步:安装ex-table-column插件 npm install ex-table-column --save //有条件可以使用c...原创 2020-05-07 09:44:51 · 7315 阅读 · 26 评论 -
vue 缓存页面滑动的距离
多读多写多记录,多学多练多思考。----------- Grapefruit.Banuit Gang(香柚帮) vue的页面缓存,都知道是用keep-alive来进行缓存的。但是keep-alive却只能缓存页面和页面的数据,却不能缓存页面滑动之后和顶部的距离,从b页面回到a页面之后又是从最顶部开始的,如果页面较短还可以,但是如果页面很长的话,给用户的体验效果就会很差。这个时候...原创 2019-05-10 11:37:26 · 1824 阅读 · 2 评论 -
vue+swiper实现轮播效果 一个页面放多个轮播
多读多写多记录,多学多练多思考。----------- Grapefruit.Banuit Gang(香柚帮) vue页面实现用swiper的轮播,话不多说,直接开始贴代码: 一 、首先要先安装swiper插件: npm install swiper --save-dev (安装淘宝镜像的也可以cnpm更...原创 2019-05-23 13:44:57 · 7836 阅读 · 4 评论 -
vue 移动端物理返回键
柚子写过一个Vue的移动端项目,当时遇到一个问题,就是按手机上的自带的物理返回按钮时,会直接退出应用程序,后来百度了一些关于手机物理返回键的文章,也终于是解决了,现在分享给大家,希望能帮助到一些朋友,最终实现的效果就是按返回键退回上一页,当退回到栈的第一页之后再按返回键才退出页面: 首先新建js文件: document.addEventListener('plusready',...原创 2019-06-14 11:07:54 · 6958 阅读 · 13 评论 -
vue页面跳转添加动画效果,实现页面跳转时左右平推的动画效果
多读多写多记录,多学多练多思考。----------- Grapefruit.Banuit Gang(香柚帮) vue项目,为页面跳转添加动画效果 app.vue文件 <template> <div id="app"> <transition :name="transitionName"> <router-view>...原创 2019-06-17 14:37:37 · 7904 阅读 · 7 评论 -
vue 页面缓存keep-alive 使用include动态实现页面缓存 根据栈的推进和返回为页面设置缓存
多读多写多记录,多学多练多思考。----------- Grapefruit.Banuit Gang(香柚帮) vue项目中为页面设置缓存,可以大大的节省性能,a页面跳转到b页面时,保留a页面的操作,b页面返回a页面时,a页面之前的操作不会发生改变,数据不会重复渲染。 vue页面缓存使用的是keep-alive,具体使用方法: app.v...原创 2019-06-12 11:44:19 · 3693 阅读 · 9 评论 -
vue自定义获取验证码组件,倒计时60秒
多读多写多记录,多学多练多思考。----------- Grapefruit.Banuit Gang(香柚帮) 自定义一个获取验证码的组件,点击按钮实现倒计时60秒 1.首先在页面html中写两个按钮,用v-show指令控制其显示隐藏 //页面按钮 <button @click="getCode" id="d" class="getphone" v-show="show"&...原创 2019-07-08 11:17:07 · 1675 阅读 · 0 评论 -
vue中使用axios封装接口,对api统一管理
要有遥不可及的梦想,也要有脚踏实地的本事。----------- Grapefruit.Banuit Gang(香柚帮) 1.首先先安装axios npm install axios -S 2.安装成功后,在src目录下新建一个axios文件夹,用来存放封装接口的js文件, 在axios/axios.js文件中写入代码: import Vue from 'vue' impor...原创 2019-07-12 10:02:57 · 2989 阅读 · 10 评论 -
vue引入全局过滤器,引入全局公共方法,引入全局变量
多读多写多记录,多学多练多思考。----------- Grapefruit.Banuit Gang(香柚帮) 一、首先我们先看vue项目中引入全局过滤器的方式: 1、先在src文件夹下新建JS文件夹,用来存放我们新建的js文件 2、在我们新建的JS文件夹下新建filters.js文件,存放过滤器的代码 // 时间戳转年月日时分秒 fun...原创 2019-07-29 10:37:02 · 2460 阅读 · 3 评论