vue
大米绿豆
交流开发心得 帮助前端小白
展开
-
vue优化首页加载时间的探索
一个月前, 公司用户反馈后台收到用户反馈, 说我们的iosApp客户端的福利中心页首次加载时间太久. 因为这个页面是嵌入的web网页. 所以早晨开会领导指示要抽时间优化下这个东西. 第一次接到这种工作, 没有什么逻辑可寻. 一开始在网上找了几种方法, 比如模块换成cdn, 优化代码 等等. 但是基本没有效果. 于是,最近的晚上和周六日都在研究, 把测试版代码改的稀巴烂. 算是...原创 2020-05-03 23:12:13 · 340 阅读 · 0 评论 -
vue中history路由模式下打包后 二级 多级路由无法访问 刷新空白404的问题
最近写了几个后台,都是用的哈希路由. 前几天写了一个移动端的任务中心. 领导要求需要用history模式的路由.于是踩了一些坑儿. 特地分享给大家. 改为history后遇到了多级路由无法访问的问题, 原因: 我们以前使用哈希路由时, 打包后, 然后访问网址network面板的js文件请求是这样的: http://ap....原创 2019-12-10 20:03:03 · 4808 阅读 · 1 评论 -
vue中自动改变页面title的简易方法
在做项目的时候, 有时候会有这种需求. 就是每跳转一次页面要改变title. 其实这种功能倒不难实现. 作为前端, 都知道document.title = "标题" 就可以改变页面title了. 但如果页面一多起来, 这样每个页面都来一句就很麻烦了. 有没有一种方法, 只在全局写一句就可以实现这个目的. 有的. 1. 在路由中添加title, 如下: ...原创 2019-08-24 22:54:12 · 995 阅读 · 0 评论 -
vue中返回到指定滚动条位置的几种方法探讨
我们在vue开发中经常会碰到一种需求, 返回页面后需要定位到滚动条指定位置, 以增强用于体验. 比如在a页面,它是个列表, a页面是不做分页的. 最常见的就是小说类网站的目录页. 或者后台类网站列表 包含查看更多按钮这种的. 也就是说这种页面我们想观看更多内容, 不然出现滚动条. 但因为vue是单页应用, 当我们点击其中一条数据, 进入b页面. a页面就销毁了. 再从b返回到a时, a...原创 2019-08-11 17:38:19 · 1613 阅读 · 0 评论 -
vue实现类似jquery 给当前元素加类名 给兄弟元素去类名的方法
jquery中有个非常好用的方法,就是加类名去类名.诸如以下功能: 此时有这样的需求, 需要用户点击每个金额的时候,边框变颜色或者背景变颜色.这种功能可以说是烂大街.jquery时代轻松两行代码搞定.但是在vue中有的新人可以没用过.在这里说一下实现这个功能的方法.也很简单. 简述思路: 1.写一个边框样式. 2. 动态绑定class 3...原创 2018-12-25 20:43:00 · 2804 阅读 · 0 评论 -
vue中移动端网页 H5网站 添加到 友盟 cnzz的方法
cnzz官网有很详细的教程,注册账号等.这里就不阐述这些流程了.主要说一下添加代码部分;整个流程也就4步.注册号账号后,根据官网的流程添加网站信息.完成后复制代码添加到项目中就可以了.https://web.umeng.com/main.php?spm=a211g2.181323.0.0.3cb23604g8CF7N&c=user&a=index这里只说一下在vue中添加c...原创 2018-12-23 20:21:04 · 3759 阅读 · 6 评论 -
vue中利用全局路由钩子给url统一添加公共参数
有的时候我们可能有这样的需求,比如现在url为m.taoyuewenhua.com/#/ 我们需要在用户每次跳转路由的时候监控有没有abc这个参数. 如果有,后端要求我们在以后跳转任何url的时候,都要在url携带上这个参数.就变成m.taoyuewenhua.com/#/&abc=xxx;这个参数称为"公共参数"; 那么,我们该如何做呢?因为...原创 2018-12-16 21:52:38 · 10748 阅读 · 7 评论 -
汇总 vue 移动端 苹果端和安卓端的兼容性问题
项目中遇到的苹果safari不兼容的问题太多了.在这里整理一下.希望能帮助到在走弯路的人. 1. 日期格式问题. 这个问题应该是遇到最多的.也是最多被熟知的.safari不识别2018-08-08的日期格式.会显示NaN. 解决方式: 在处理日期之前转换为2018/08/08的格式. 2. 设置了input背景颜色在safari颜色异常显示...原创 2018-12-01 22:06:50 · 9646 阅读 · 0 评论 -
vue中获取dom元素的方法 ref $refs的使用
vue官方不建议我们直接操作dom.但真到项目实战中.有时候还是需要一些操作dom的功能.目前我在vue项目中最常用两种方式操作dom;下面简单说一些. 第一种: 封装一个类似于jquery的函数.通过函数执行访问到dom元素. 第二种: 使用vue提供的实例属性$refs获取到dom. 先说下第一种: 封装函数如下:Vue....原创 2018-12-01 20:50:20 · 8004 阅读 · 0 评论 -
vue利用router-link 传参 和 获取参数的方式
本章只谈如何利用router-link传递query参数.暂时不谈编程导航传参.两者差不多.今天把router-link这种传参和获取参数的形式讲解清楚.希望对大家有帮助. 假如目前我们现在需要做一个项目.路由的设计是这样的: 主页:www.wangyiyinyue.com; 首页负责展示专辑封面;点击进去专辑详情页面; ...原创 2018-11-10 17:50:47 · 7303 阅读 · 0 评论 -
vue表单验证库async-validator的使用 elementUi + form
目前使用vue在构建登录注册页面的时候,一般都是引入elementUi的form组件.它添加了async-validator.大幅提升了开发效率.async-validator是一个用来验证数据规则的一个库.它的github地址是https://github.com/yiminghe/async-validator .我们可以在elementui里直接使用它.下面介绍它...原创 2018-10-06 14:30:22 · 23844 阅读 · 7 评论 -
vue利用 v-bind 实现 点击变色 切换 样式
切换样式应该是v-bind很常用的功能了.简单写一个切换样式的案例.供初学者参考吧.代码如下: <p :class="{red: !isshow,blue: isshow}" @click="isshow=!isshow">我爱云虹</p>export default { data() { return { isshow: true...原创 2018-10-05 23:51:16 · 20792 阅读 · 0 评论 -
利用Vue计算数据属性实现简单的表单校验
计算数据属性(官网称呼),又叫动态数据绑定(相对于静态数据绑定而言).可以在dom渲染之前修改数据.按照官网的解释,计算数据属性是为了简化模板的运算逻辑.从而利于维护.把复杂的逻辑绑定在computed里.当然,利用它也可以做很多事情.比如单选,全选的实现.今天简单实现一下表单的校验.原理逻辑都差不多. 初学者需注意: ...原创 2018-09-15 13:45:34 · 2255 阅读 · 0 评论 -
整理vue2.0中的指令
1. v-bind(语法糖 ":"). 将dom的属性值变成js环境,或者绑定样式和类;2. v-model. 实现数据双向绑定;3. v-on(语法糖"@"). 为dom绑定事件;4. v-if,v-else,v-else-if. 条件模板指令. v-if可通过true和false的切换实现创建和删除元素;5. v-show 实现元素的显隐,配合.demo-en...原创 2018-07-31 15:54:35 · 239 阅读 · 0 评论