jojoer's pace

20 2021年09月

SHOW YOUR WORK!

你不必是个天才专注过程而非结果找到你想学的东西，并在别人面前学习分享你的过程和成果，更重要的是分享你的失败每天分享一点内容优质内容的权衡标准：他能否帮助到别人启发与灵感方法与进度结果与心得管理与协助运用你的想象力讲有趣的故事教给别人你会的东西对学到的东西不断的进行总结、归纳、思考、表达把学到的东西藏

2021年09月20日

19 2021年08月

overflow-x: hidden 会默认添加垂直的滚动条

当元素设置了 overflow-x: hidden 样式时，该元素的 overflow-y 会被浏览器设置为 auto，而不是默认值 visible。详情见：CSS overflow-x: visible; and overflow-y: hidden; causing scrollbar issu

2021年08月19日

16 2021年08月

使用 Meta 标签改进 NuxtJs 站点的 SEO，以及解决 data-n-head 导致网站验证失败的问题

这篇文章并非 SEO 指南，它只是一篇简短的文章，让你了解一些基本的 meta 标签。Nuxt MetaNuxtJs 使每个页面的元标记配置非常简单。我们可以通过全局引入和单个页面引入两种方式配置 meta 标签。首先是全局配置，在项目根目录 nuxt.config.js 文件上：module.ex

2021年08月16日

10 2021年08月

解决 Uni-app 中 Class 和 Style 绑定失败，显示"object object"的问题

Uni-app为节省性能，将Class和style的表达式通过compiler硬编码到了Ｕni-app中。Class 支持的语法：<view :class="{ active: isActive }">111</view><view class=&q

2021年08月10日

01 2021年08月

组件和状态的设计思路

在参与腾讯某小程序的开发过程中，发现由于功能过于复杂，导致页面的代码异常复杂，而且年代久远，重构起来成本过高。想起之前在负责“i深圳”智能客服项目的时候写React的某段经历，由于是自己从0到1负责整个项目，所以比较好把控整体架构。由于React、Vue等框架都是以数据驱动视图，所以我拿到一个模块需

2021年08月01日

19 2021年07月

使用 background 模拟文字下划线

text-decoration无法还原设计稿的时候，或者text-underline-offset不兼容的时候，可以用下面的代码模拟文字下划线的功能： // 模拟重复的下划线，兼容长留言，64rpx *(1-98%) ≈ 1rpx（64rpx为line-height） backg

2021年07月19日

15 2021年07月

h5调试插件eruda

2021年07月15日

22 2021年06月

移动端禁止长按图片弹出菜单和禁止文本选择

禁止长按图片弹出菜单img{ pointer-events: none; user-select:none; } 禁止文本选择p { user-select:none; }

2021年06月22日

17 2021年06月

微信小程序组件样式隔离

默认情况下，自定义组件的样式只受到自定义组件 wxss 的影响。除非以下两种情况：app.wxss 或页面的 wxss 中使用了标签名选择器（或一些其他特殊选择器）来直接指定样式，这些选择器会影响到页面和全部组件。通常情况下这是不推荐的做法。指定特殊的样式隔离选项 styleIsolation 。C

2021年06月17日

01 2021年06月

node 版本切换/回退

node 版本切换/回退：sudo npm install n -g 安装node版本管理模块n；sudo n 10.20.1 安装指定版本号；跑完搞定

2021年06月01日

28 2021年04月

小程序弹窗禁止滚动穿透

经测试，在不做特殊处理的情况下，小程序页面的弹窗里出现可滚动元素，会触发滚动穿透。解决方案：原生小程序<view class="dialog-modal" hidden="{{hide}}" bind:tap="tapClose" c

2021年04月28日

19 2020年12月

vue 生命周期与组件间通信

Vue 生命周期生命周期图示Vue 父子组件生命周期执行顺序加载渲染过程父 beforeCreate -> 父 created -> 父 beforeMount -> 子 beforeCreate -> 子 created -> 子 beforeMount ->

2020年12月19日

16 2020年12月

JS：复制内容到剪贴板（无插件，兼容所有浏览器）

HTML部分:<button onclick="copyToClip('内容')"> Copy </button>JS部分:/** * 复制单行内容到粘贴板 * content : 需要复制的内容 * message : 复制完后的提示，不传则默认提示&q

2020年12月16日

12 2020年09月

js数组排序(字符串排序)

排序常用方法：sort1. 语法：arr.sort([compareFunction]) ：返回一个新的数组如果 compareFunction(a, b) 小于 0 ，那么 a 会被排列到 b 之前；如果 compareFunction(a, b) 等于 0 ， a 和 b 的相对位置不变。备注

2020年09月12日

30 2018年09月

Vscode + ESLint + Pretter 配置

安装插件ESLintPrettier - Code formatter配置 settings.json{ "eslint.alwaysShowStatus": true, "editor.codeActionsOnSave": { &

2018年09月30日

03 2017年10月

Vue 模板编译原理解析

JS 的 with 语法在了解 vue 编译原理之前，需要认识 with 语法。简单来说，使用 with ，能改变 {} 内自由变量的查找方式，将 {} 内自由变量，当作 obj 的属性来查找。代码演示如下：const obj = { a: 100, b: 200 };with (obj) { c

2017年10月03日

03 2017年10月

前端路由原理

前端路由路由（Router）这个概念最先是后端出现的，是用来跟后端服务器进行交互的一种方式，通过不同的路径，来请求不同的资源，请求不同的页面是路由的其中一种功能。前端随着 ajax 的流行，数据请求可以在不刷新浏览器的情况下进行。异步交互体验中最盛行的就是 SPA —— 单页应用。单页应用不仅仅是在

2017年10月03日

02 2017年10月

虚拟 DOM 与 diff 算法

虚拟 DOM 实现原理通过 JS 的 Object 对象来模拟 DOM 中的节点，然后通过特定的 render 方法，将其渲染成真实的 DOM 节点。dom diff 则是通过 JS 层面的计算，返回 patch 对象（打补丁的方式），通过特定的操作解析 patch 对象，完成页面的重现渲染。实现过

2017年10月02日

02 2017年10月

为什么要使用虚拟 DOM？

为了理解虚拟 DOM，将从浏览器的工作流程开始讲起，以及探究 DOM 更改后到底发生了什么。

2017年10月02日

19 2017年07月

javascript 的 self 和 this

self打开任何一个网页，浏览器会首先创建一个窗口，这个窗口就是一个 window 对象，也是 js 运行所依附的全局环境对象和全局作用域对象。self 指窗口本身，它返回的对象跟 window 对象是一模一样的。thisc# 有 this 关键字，它的主要作用就是指代当前对象实例（参数传递和索引器

2017年07月19日