挖坑指南: canvas元素的宽高属性和css中的宽高(大型翻车现场..) 前言在微信小程序中做分享海报, 需要绘制 canvas,设置图片 100% 占满元素, 作为海报的背景。开始文档翻一翻, canvas.drawImage() 一把梭, 呃呃呃…发现背景图片没有按照原图 100% 平铺, 而是只取了部分, 变形了实践装X失败, 还是仔仔细细看看文档drawImage(image sx, sy, sWidth, sHeight, dx, dy, dWid...
挖坑指南: 微信小程序this.setData({ })的骚操作 如果想设置 this.data.filter.Room 的值, 无法直接通过动态 key 的方式设置selectedFilterItem(e) { var dataset = e.currentTarget.dataset this.setData({ // 直接使用变量的形式是行不通的 filter[dataset.key]: dataset.value }) ...
记一次重大事故:愿我们一生温暖纯良,不舍爱与自由~ 前言在较早的时候, mpvue 刚出道, 试了一下坑, 在博客中记录了下来, 希望给之后入坑的人一个简单参考。后期随着 mpvue 的发展, 文章阅读数也越来越多。但是呢, mpvue 的发展也带来了新的问题, 文章写于早期, 其中的一些方式方法可能不具备实际的指导意义。在文中有放自己的二维码, 也是希望博友有问题能够一起交流, 在技术的路上携手共进, 互帮互助; 如果博文中有不当的地方, 能...
挖坑指南:vscode配置.md文件预览配置 前言markdown必备技能,早用早升级~开始你可能会像我一样在配置的时候遇到如下问题,希望我遇到的坑,能给你一点参考实践安装markdown preview enhanced插件 如果你安装的插件不可以用,可以试一试安装旧版本的。 自己配置预览的样式 window电脑,ctrl+shift+p, 输入Markdown Preview Enhanced: Customiz...
挖坑指南:$(window).scroll()事件没有生效 直接上车吧~绑定了滚动事件,但是页面滚动时,事件的回调函数并没有触发。一开始严重怀疑哪里写错了,后来检查了真的没问题,这个锅谁背?检查CSS,发现html设置了overflow-x: hidden; 罪魁祸首之前也写过一篇关于CSS样式影响JS代码执行的文章,感觉两者越来越有意思...嘘寒问暖 不如打笔巨款~...
挖坑指南:vue刷新某个路由就404了,咋办? 前言单页后台,上传到线上,在某个路由刷新时就报错404。开始为什么会出现这样的问题呢?配置路由时,设置了访问模式为mode: 'history';而后端是无法判断这是一个前端路由的。它会按照路径去找相应的资源,但是在服务器中并不存在,所以...404实践我们找到官方的文档看看:https://router.vuejs.org/zh/guide/essentials/h...
挖坑指南:网站http请求全变https? 前言开发的后台单页系统,上到线上测试时,需要配置为php文件。开始测试的地址,未使用https,但是vue项目打包后的资源请求都是https的。导致页面加载时,请求不到资源。实践最后在页面中发现配置了一个meta:<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests...
挖坑指南:如何在引用的外部js文件中获取vue页面实例?(独家) 原文链接前言在基于iView的后台项目中,表格组件是我们的老朋友了。实现如下的效果更是最基本的需求:开始在iView早期1.x的版本(其实在~2.0.0-rc.7也能使用),想要渲染这样的效果,代码如下:升级2.x后,Table组件的render()也作了更改:vue官方文档(render()):https://cn.vuejs.org/v2/guide/...
挖坑指南:如何在引用的外部js文件中获取vue页面实例?(独家) 原文链接前言在基于iView的后台项目中,表格组件是我们的老朋友了。实现如下的效果更是最基本的需求:开始在iView早期1.x的版本(其实在~2.0.0-rc.7也能使用),想要渲染这样的效果,代码如下:升级2.x后,Table组件的render()也作了更改:vue官方文档(render()):https://cn.vuejs.org/v2/guide/...
挖坑指南:在vuex的多个module中的getters里存在相同的方法名,使用mapGetters会报错? 原文链接前言其实这个标题就是我们今天要谈论的话题。开始在vuex中有多个module是很正常滴,为了方便管理呢,我们有些module中使用了相同的名称。那么,在使用时,就会报错啦~实践其实在vuex的官网,已经为我们描述过啦~vuex:https://vuex.vuejs.org/zh/guide/modules.html#%E5%91%BD%E5%90%8D%E7%A...
挖坑指南:[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恰巧是一个对象。解决:循环时添加index,或者将item.key对象中的某一项的值作为key。总结嘘寒问暖 不如打...
挖坑指南:iView Select的Option@click事件无效 前言日常挖坑。。开始上车。。实践bug描述:Select组件,设置了filterable和remote,前端启用模糊查询。期望在用户选择某一结果项时,获取选择的对象。给Option绑定了点击事件,但是并未生效。为什么呢?应该是组件自身做了事件监听。那该怎么办呢?改用@click.native=""绑定事件。总结why? How? What?嘘寒问暖 ...
挖坑指南:iView-admin动态配置route.meta.title(独家) 原文链接前言新的项目,基于iView-admin。结合自身的项目需求,对官方的模板进行一些修改。以达到动态修改route.meta,并同步更新面包屑导航文字和标签页标题。开始如果你还未使用过iView-admin或者正在上路,那我们先来看看项目的需求以及遇到的问题。那应该如何解决这个问题呢?实践方法一:一开始想到的方法,就是在新建页面的created()中,通过th...
挖坑指南:iView-admin动态配置route.meta.title(独家) 原文链接前言新的项目,基于iView-admin。结合自身的项目需求,对官方的模板进行一些修改。以达到动态修改route.meta,并同步更新面包屑导航文字和标签页标题。开始如果你还未使用过iView-admin或者正在上路,那我们先来看看项目的需求以及遇到的问题。那应该如何解决这个问题呢?实践方法一:一开始想到的方法,就是在新建页面的created()中,通过th...
挖坑指南:ESLint + VS Code自动格式化代码 原文链接前言最近在整理公司的之前的项目,对整个产品线进行梳理重构。由于项目的编码人员换了好几拨,每个人编码又各有各的风格。现在在重新翻看,可读性很差。考虑到后期项目的扩展,以及对现有项目的优化,决定对代码进行整理,并统一使用ESLint进行规范约束。开始“编码一时爽,重构火葬场。”刚开始接触vue学习的时候,也都是自然而然地关闭了ESLint。以至于没有从头开始养成良好的...
挖坑指南:ESLint + VS Code自动格式化代码 原文链接前言最近在整理公司的之前的项目,对整个产品线进行梳理重构。由于项目的编码人员换了好几拨,每个人编码又各有各的风格。现在在重新翻看,可读性很差。考虑到后期项目的扩展,以及对现有项目的优化,决定对代码进行整理,并统一使用ESLint进行规范约束。开始“编码一时爽,重构火葬场。”刚开始接触vue学习的时候,也都是自然而然地关闭了ESLint。以至于没有从头开始养成良好的...
挖坑指南:如何通过事件动态地切换iView的Tabs(v-bind与v-model的区别) 前言iView的官方文档算是很详细的了,但是如果我们没有一定的编程经验,看文档也是一件令人困惑的事情。Tabs官方文档:http://v2.iviewui.com/components/tabs#API开始先来看看项目的需求看看官方文档为我们提供的接口有了这些基本就可以开始啦~实践页面结构为Tabs绑定了事件指定了value。可以实现动态切换。页面事...
挖坑指南:iView表单 日期校验出错 前言表单数据的验证在前端是很有必要的,它是数据的第一道过滤。可以避免一些错误的发生开始先看看我们的使用虽然iView的官方已经更新到3.0的版本了,但是目前项目中使用的还是2.0的版本。官方的文档:http://v2.iviewui.com/components/form实践对照看了官方的文档,使用方式是相同的,字段也是没有问题滴。校验为啥就会报错呢?仔细地对照...