道招
邮箱收件人组件成长历程(三)跨栏拖拽不同数据方案对比
前几天写了收件人组件,它实际就是一个既能输入搜索又能标签形式展示的组件,我称它为SmartInputSelect(以下简称sis组件),在实现下列需求时遇到了些问题,需求就是想实现多个sis组件的邮箱地址能够相互拖拽,效果类似剪切操作。比如从sis_a中的邮箱地址拖拽到sis_b中,同时需要sis_a中的那个会被移除。 下面是具体的代码实现,每行的具体作用已经有注释了。 将拖拽数组逻辑简单写
wordpress博客提示“Briefly unavailable for scheduled maintenance. Check back in a minute”
所谓“Briefly unavailable for scheduled maintenance. Check back in a minute”翻译过来就是“正在执行例行维护,请一分钟后回来”,这个问题一般出现在我们升级wordpress博客或者插件期间,有人访问,网址给予了这个提示,但是有时候不巧的是我们正在升级,然后因为网络等其它原因,升级失败了,我们只能刷新,然后我们作为网站的管理员,我
邮箱收件人组件成长历程(二)(React hooks升级版)
记得自己之前写过一篇 《邮箱收件人组件(vue版)成长历程(一)》 记得当时里面写到了自己使用的是可编辑div来进行输入的,同时提到 当时出于挑战自己和青铜的倔强,想试着换个方案,完全使用可编辑div来实现。。。这个小小的倔强为后续很多功能瓶颈埋下了隐患。。。 使用contenteditable的div缺点 具体的隐患是什么的? 因为方案中采用的点击插入新收件人时实际上就是
Mysql报错“this is incompatible with sql_mode=only_full_group_by”
由于本站使用的是msyql8.x版本的mysql数据库,版本较高,发现网站的“月份存档”的数据不展示了,经过排查发现是接口未能如期返回的数据,而是出现了报错“this is incompatible with sql_mode=only_full_group_by”,显然是自己的sql语句里面有 group_by ,出现了兼容性问题。 我先进Mysql里面执行 select @@GLOBAL
道招网回归国内主机并完成备案
之前道招网一直使用的国外的vps主机,鉴于vps的ip可能存在被误封的风险,特将网站全部内容迁移回阿里云上海主机,并备案,期间造成网址较长时间无法正常访问,深表抱歉。
Vue和React hooks实现Select批量选择、选中条数、全选、反选实现对比
批量选择、全选、反选这些功能使用频率还是很高的,下面直接看看Vue和React分别怎么实现吧。 Vue 在使用Vue的时候是很容易实现的,我们以下列数据格式为例: const dataList = [{ id: 1, label: '第一个', }, { id: 2, label: '第二个', }, {
网址改用七牛云存储图片
本站上传的图片不多,但是为了以后的站点扩展,鉴于七牛云现在每月还有免费流量,最终决定迁移到七牛云去,并准备删除vps里面的图片了。 免费真香! 迁移步骤 将网址的历史图片上传至七牛云 这个最好是用官方工具来进行 七牛云官方的 数据迁移工具 将历史图片迁移到了七牛云内。 比如我用的是mac版的kodoimport,使用的是local模式,修改 kodoimport_ma
vue迁移react使用useReducer hooks还想支持回调?
鉴于目前有个任务是把手上的vue项目迁移到react,为了尽可能的降低期间造成的功能缺陷,很自然的就会想到使用一个方法一个方法的迁移,有的场景在vue中很自然,在react中,尤其是在使用react hooks时,有的过程就不好弄,我就毕竟苦于在react hooks中没有class组件里面的setState的回调函数,导致后面的取值拿不到最新的state。 比如下面的例子。 In vue
Vue同一路由跳转页面不刷新解决方案及注意事项之二
之前写过一个 《Vue同一路由跳转页面不刷新解决方案及注意事项》 ,在这篇文章里面鞋到了怎么解决这个问题,具体内容可以点击查看,这里简单说一下,就是利用将时间戳传给路由的query,也就导致 $route.fullPath 不一样,然后配合 key 来解决。同时也提到了这样做的缺陷,缺点就是组件内的路有生命周期 beforeRouteLeave 不执行了,我们通常在这个周期里面做一些例如编辑文章
项目Vue转成React hooks可能存在的问题--急需类似setState回调
假设在Vue中有如下三个方法,并且初始时 this.a = ‘a’; this.b = ‘b’; funA() { this.a = '1221'; this.funB(); return this.funC(); }, funB() { this.a = this.a
关注道招网公众帐号
道招开发者二群