自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

原创 挖坑指南: canvas元素的宽高属性和css中的宽高(大型翻车现场..)

前言 在微信小程序中做分享海报, 需要绘制 canvas,设置图片 100% 占满元素, 作为海报的背景。 开始 文档翻一翻, canvas.drawImage() 一把梭, 呃呃呃…发现背景图片没有按照原图 100% 平铺, 而是只取了部分, 变形了 实践 装X失败, 还是仔仔细细看看文档 dr...

2019-01-11 12:13:57 419 0

原创 挖坑指南: 微信小程序this.setData({ })的骚操作

如果想设置 this.data.filter.Room 的值, 无法直接通过动态 key 的方式设置 selectedFilterItem(e) { var dataset = e.currentTarget.dataset this.setData({ // 直接使用变量的形式是...

2019-01-05 10:57:07 459 0

原创 记一次重大事故:愿我们一生温暖纯良,不舍爱与自由~

前言 在较早的时候, mpvue 刚出道, 试了一下坑, 在博客中记录了下来, 希望给之后入坑的人一个简单参考。后期随着 mpvue 的发展, 文章阅读数也越来越多。但是呢, mpvue 的发展也带来了新的问题, 文章写于早期, 其中的一些方式方法可能不具备实际的指导意义。 在文中有放自己的二维码...

2018-12-22 10:29:58 410 0

原创 挖坑指南:vue刷新某个路由就404了,咋办?

前言 单页后台,上传到线上,在某个路由刷新时就报错404。 开始 为什么会出现这样的问题呢? 配置路由时,设置了访问模式为mode: 'history';而后端是无法判断这是一个前端路由的。它会按照路径去找相应的资源,但是在服务器中并不存在,所以...404 实践...

2018-11-19 17:30:43 2527 0

原创 挖坑指南:如何在引用的外部js文件中获取vue页面实例?(独家)

原文链接 前言 在基于iView的后台项目中,表格组件是我们的老朋友了。实现如下的效果更是最基本的需求: 开始 在iView早期1.x的版本(其实在~2.0.0-rc.7也能使用),想要渲染这样的效果,代码如下: 升级2.x后,Table组件的render()也作了更改: ...

2018-11-19 08:54:53 6235 0

原创 挖坑指南:在vuex的多个module中的getters里存在相同的方法名,使用mapGetters会报错?

原文链接 前言 其实这个标题就是我们今天要谈论的话题。 开始 在vuex中有多个module是很正常滴,为了方便管理呢,我们有些module中使用了相同的名称。那么,在使用时,就会报错啦~ 实践 其实在vuex的官网,已经为我们描述过啦~ vuex:https://vuex.vuej...

2018-11-17 08:30:01 4084 0

原创 挖坑指南:[Vue warn]: Avoid using non-primitive value as key, use string/number value instead

开始 报错信息:[Vue warn]: Avoid using non-primitive value as key, use string/number value instead 实践 原因: 在v-for遍历时,将item作为:key的值,而遍历出来的item恰巧是一个对象。 解决:...

2018-11-16 18:02:13 3415 0

原创 挖坑指南:iView Select的Option@click事件无效

前言 日常挖坑。。 开始 上车。。 实践 bug描述:Select组件,设置了filterable和remote,前端启用模糊查询。期望在用户选择某一结果项时,获取选择的对象。给Option绑定了点击事件,但是并未生效。 为什么呢? 应该是组件自身做了事件监听。 那该怎么办呢? ...

2018-11-15 16:12:50 3294 0

原创 挖坑指南:iView-admin动态配置route.meta.title(独家)

原文链接 前言 新的项目,基于iView-admin。结合自身的项目需求,对官方的模板进行一些修改。以达到动态修改route.meta,并同步更新面包屑导航文字和标签页标题。 开始 如果你还未使用过iView-admin或者正在上路,那我们先来看看项目的需求以及遇到的问题。 那应该如...

2018-11-14 16:03:15 5281 5

原创 挖坑指南:ESLint + VS Code自动格式化代码

原文链接 前言 最近在整理公司的之前的项目,对整个产品线进行梳理重构。由于项目的编码人员换了好几拨,每个人编码又各有各的风格。现在在重新翻看,可读性很差。考虑到后期项目的扩展,以及对现有项目的优化,决定对代码进行整理,并统一使用ESLint进行规范约束。 开始 “编码一时爽,重构火葬场。...

2018-11-10 17:02:47 11131 1

原创 挖坑指南:如何查看npm -g全局安装的包

npm list -g depth 0 嘘寒问暖 不如打笔巨款~

2018-11-10 12:08:09 828 1

原创 挖坑指南:如何通过事件动态地切换iView的Tabs(v-bind与v-model的区别)

前言 iView的官方文档算是很详细的了,但是如果我们没有一定的编程经验,看文档也是一件令人困惑的事情。 Tabs官方文档:http://v2.iviewui.com/components/tabs#API 开始 先来看看项目的需求 看看官方文档为我们提供的接口 有了这些基本就可以...

2018-11-03 12:22:22 12523 3

原创 挖坑指南:iView表单 日期校验出错

前言 表单数据的验证在前端是很有必要的,它是数据的第一道过滤。可以避免一些错误的发生 开始 先看看我们的使用 虽然iView的官方已经更新到3.0的版本了,但是目前项目中使用的还是2.0的版本。 官方的文档:http://v2.iviewui.com/components/form ...

2018-11-02 18:02:47 2464 0

原创 挖坑指南:[Vue warn]: Invalid prop: custom validator check failed for prop "XXX".

前言 表单表单,开发后台尽是表单。话不多说,先看看问题吧。 开始 这个项目呢,是使用了iView UI框架。开始查找网上类似的问题。type排查了一遍,最后发现是Input组件的type赋值为number。而官方支持的呢,如下 好吧~ 开发中遇到各种各样的大问题小问题是难免的,关...

2018-11-02 09:51:38 18445 0

原创 Vue: keep-alive在项目中的应用

前言 上图看看项目基本情况。 再次用文字简单地描述一下,左侧是公司的组织架构图。选择部门,在右侧展示对应的部门名称以及部门的子部门和成员数据。左侧是固定的,右侧的内容包含两部分,面包屑导航和子路由(初始时是默认路由/companyStructure/structureIndex)。由于每个页面...

2018-11-01 11:03:57 552 0

原创 Vue挖坑指南:[vue-router] Named Route 'XXX' has a default child route.

前言 OA系统,使用了路由的嵌套,希望在访问子模块时,默认加载模块的默认路由。即为子模块设置默认路由 。 开始 我们先来看看,如何为子模块设置默认的路由。 这样写,会出现什么问题呢?打开控制台看看。 实践 vue-router给我们报了两个警告,我们一个一个来看。 第一个:[vu...

2018-11-01 09:02:28 5478 3

原创 Vue挖坑指南: 如何在main.js中修改vuex中的值?

直接上图吧~好 总结 就是这么任性~嘻嘻(*^__^*) 嘻嘻…… 嘘寒问暖 不如打笔巨款~

2018-10-31 16:56:47 5376 0

原创 Vue: export default中的name属性到底有啥作用呢?

原文链接 前言 又开始一个全新的项目,每天都要元气满满呀~在划分模块和创建单页面组件时,常常写到name。嵌套路由中,index.vue极为常见,那么在vue中,export default { name: 'xxx'} 中的name到底有啥作用呢? 开始 还是先回到官...

2018-10-31 11:08:01 40455 0

原创 前端进阶:vue中的computed和watch的异同

原文链接 前言 心情很忐忑,当我写下这个标题。想起年初时在杭州求职,电面了一家武汉的公司,面试官就抛了这样一个问题。那时候还懵懵懂懂,就知道如何使用,并没有太清楚两者的区别。 开始 有时候写这些东西,真的怕误导了一些人,以下描述的异同,只是我个人的观点。如果有什么不当之处,还望各位博友指出...

2018-10-23 18:12:16 577 0

原创 挖坑指南:npm ERR! write after end

前言 团队的项目,昨天还是好好滴,但是呢,github挂了,提交不了代码。晚上其他成员上传了代码,今天决定重新提交。 开始 提交时发生冲突,回退了一下版本。 // 获取历史版本id git log --pretty=oneline // 回退到指定的版本 git reset --hard...

2018-10-23 10:14:50 1783 0

原创 挖坑指南:Vue.directive()自定义指令的实践(含源码)

前言 迫不及待想要上车试一试,直接贴代码吧。 开始 两个小例子,图片的加载优化以及第三方插件的配合使用。参考的资料在我分享的这篇博文中有记录,感兴趣的同学,可以参考更多。 <!DOCTYPE html> <html lang="en"> ...

2018-10-22 16:44:59 891 0

原创 前端进阶:一些好的博客博文分享

前言 之前在读书会听到的,人与人思考同一问题时,心理表征是不同的。在技术圈,各路大神大牛云集。向他们看齐,学习他们发现问题、分析问题以及解决问题的方式,能让我们更好地看到差距,提升自我。 开始 我不盲目追随谁,只是取人所长,提升自我。以下是一些我自己在平时扩展学习中,发现的较好的博客与博文,...

2018-10-22 14:54:34 197 0

原创 挖坑指南:npm install命令各参数的区别(--sava --save-dev -g)

前言 在前端工作中,npm已经成为必不可少的一部分。npm install可以为我们的项目安装依赖,那么这个命令的参数,各代表什么含义呢? 开始 我们逐一来看看npm install --save-dev: 安装我们项目开发时的依赖,比如一些插件,对我们的less/sass/js/img进行...

2018-10-19 09:03:08 1710 2

原创 挖坑指南:process.cwd()与__dirname的爱恨情仇

在网上找了蛮多资料,发现一片通俗易懂的,分享给大家。 https://www.jianshu.com/p/aeb3d4318d07 嘘寒问暖 不如打笔巨款~

2018-10-18 16:31:51 415 0

原创 CSS: transition和@keyframes动画

前言 为了更好的用户体验,在开发时我们使用了适当的动画,实现一些切换的效果。在使用@keyframes时遇到一点问题,于是开始找其他的解决方案,发现了transition很适合。 开始 先上一张图片,看看要实现的功能,很简单的。就是要实现右侧小三角的旋转 实践 一开始是使用了@key...

2018-10-17 11:49:04 670 0

原创 挖坑指南:百度鹰眼web api的使用与问题总结

前言 公司想做外勤管理的工具,要记录员工的出行轨迹,研究了一下,发现高德、腾讯都没有相关的API,只有百度地图有一个鹰眼的服务。那就试试呗~ 开始 货比三家,先来看看其他两家的解决方案。 高德地图:https://lbs.amap.com/dev/demo/path-record#Andr...

2018-10-12 10:50:24 2557 4

原创 微信小程序:wx.navigateBack()时弹窗一直显示

前言 小程序使用服务需要用户绑定手机号,在进入页面时,判断用户是否授权,未授权的话,弹窗组件(自定义的)显示 onShow(){ let isBind = xxx if(!isBind){ // 获取弹窗组件(自定义的)实例 this.bindTip = this.s...

2018-10-11 09:09:38 1439 0

原创 微信小程序:globalData和Storage数据存储的错误示例

前言 在小程序登录是,将返回的用户数据,存储在globalData中和storage中。 // 存储的数据是一个对象 wx.setStorageSync('userAuthData', user.data.data); this.globalData.userAuthDa...

2018-10-10 18:33:10 13606 3

原创 挖坑指南:各地图JavaScript API常用接口

前言 从pc到wap到小程序,不同的业务需求,记录一些常用的API。 开始 自己项目中使用的是高德地图,第三方的数据是百度地图的经纬度,小程序SDK是腾讯的。各地图提供的接口很丰富,使用时参照对应的示例即可。 实践 记录一下项目中使用到的一些API,以及其对应的需求场景 腾讯地图 经...

2018-10-09 11:09:04 660 0

原创 微信小程序:惊!CSS导致JS事件未触发...

前言 研究navigationStyle:costom,使用自定义的导航。老规矩,先上设计稿: 要实现左侧的自定义导航,该导航有一个圆角的边框,圆角的啊~ 开始 移动端经典的1px问题+圆角边框。早期,在.less文件中定义了.border-1px()用于解决移动端1px问题,后期为了...

2018-10-08 16:54:22 428 0

原创 挖坑指南: 如何在微信端(x5内核)实现视频的内联播放?

前言 之前的项目是基于微信端的,接入了直播的板块,要求在手机上可以一边看直播一边评论聊天。当时研究了两天,才慢慢清晰,记录一下。 开始 先来看一张设计稿,清晰明了 整个播放页面可以划分为两大部分,上面是视频,下面是聊天互动区域。 由于是直播,视频的实时播放格式的.m3u8格式的,播放...

2018-10-07 16:44:34 3105 4

原创 JS: 百度地图与腾讯/高德地图经纬度转换

前言 在开发中使用了第三方的数据,由于经纬度使用的是第三方的数组,他们使用的是百度的地图坐标。在项目中使用时,能用百度地图去解析自然是最好的,但是呢,该项目是基于微信小程序的,百度地图针对小程序提供的API功能不是很完善,难以实现想要的需求,所以采用腾讯官方的地图。 开始 使用不同的地图,相...

2018-10-07 15:43:09 7758 1

原创 微信小程序:高德地图在小程序中的实践(含静态地图)

前言 前人栽树,后人乘凉。记录下工作的点点滴滴,让同道中人少走弯路~ 来看看需求和问题:房产相关的项目,详情中需要显示房源地址,底部要有固定的菜单(不是tabbar),房源数据过多,数据超过一屏时,map组件从底部进入,会穿透固定在底部的菜单,导致页面闪烁。 开始 参考一些行业大佬的产品,...

2018-09-29 12:46:46 4374 0

原创 JS: label的click事件执行了两次

前言 混合开发的后台,需要根据当前选择的checkbox动态生成input组,所以就给label绑定了click事件,但是console时发现click事件执行了两次。 解决 直接给label内部的input绑定click事件。 参考资料:http://www.w3school.com.c...

2018-09-28 08:50:50 516 0

原创 微信小程序:跳坑指南——常见问题总结

前言 记录几个微信小程序,在真机上预览遇到的问题。 开始 上传图片失败描述:在开发工具上传正常,打开调试,上传正常解决:在小程序后台,要添加uploadFile合法域名 下拉刷新不回弹描述:下拉刷新时,页面没有回弹解决:在onPullDownRefresh(){ }中,主动调用wx.sto...

2018-09-25 15:46:42 204 0

原创 微信小程序:如何在小程序中使用骨架屏?

原文链接 前言 骨架屏,就是在页面数据尚未加载前,先给用户展示出页面的大致结构,直到请求数据返回后,再渲染页面,以优化用户体验。 骨架屏在前端的应用已经很普遍了,之前接手vue的项目,没能用上,现在开发小程序,想在小程序中试一试。看着美团外卖小程序的骨架屏,很nice~ 开始 没有使用骨...

2018-09-20 13:14:36 10172 3

原创 微信小程序:使用externalClass自定义组件样式

前言 之前分享过一篇关于自定义小程序密码/验证码组件的博文,一开始写的时候是解决设置安全密码的需求,现在提现时,也是需要使用到,但是样式稍有不同,所以希望能够通过自定义样式,实现复用。 开始 看官方文档,万变不离其宗。官方文档就是最基本的游戏规则,我们可以根据官方的示例,照葫芦画瓢,实现我们...

2018-09-19 16:45:46 8076 1

原创 微信小程序:如何在{{}}中使用函数?WXML+WXS

前言 在项目中涉及到百分比的计算,js浮点数运算会出现精度问题,造成小数位数过多,因此想在模板语法中对值进行相应的处理。 开始 按照常规用法,使用js中的toFixed()进行处理: <view>¥{{(cashMoney*0.02).toFixed(2)}}手续费(费率2%...

2018-09-19 09:54:39 12599 1

原创 微信小程序:外部字体引用以及遇到的一些问题(字体图标/字体文件)

前言 设计稿中,有用到手机未内置的第三方字体。如何在微信小程序中使用呢? 开始 触类旁通,小程序的wxss语法与css是一致的。我们首先想到的是@font-face{}。没错,它就是今天的主角~ 在正式开始之前,我们先来看看两个常见的概念: 字体文件:引用该类型文件,控制文字的显示形态。...

2018-09-12 11:38:47 17266 4

原创 github: 第一次提交代码遇到的问题

前言 之前写过一篇博文mpvue项目中使用第三方UI组件库。mpvue的项目是在它开源早期的实践,现在已经更新挺多的了。有一些小伙伴在看文章时,有所疑惑,所以整理一份代码放在github上,供大家参阅。 开始 在此之前,还未在github上上传过自己的代码。创建的过程就不在此详述,不清楚的同...

2018-09-11 10:55:36 220 0

提示
确定要删除当前文章?
取消 删除