UPDATE 2022/11/27

这篇文章内容已经过时，不再具有参考意义。
实际上实现起来非常简单，只需要调用wx.getMenuButtonBoundingClientRect()方法获取胶囊的位置信息，再给相关的 wxml 节点加上合适的高度即可，例如：

<!-- 假如这是页面标题 -->
<view class="title" style="margin-top:{{胶囊距离顶部的高度}};height:{{胶囊自身高度}}px"></view>

/* wxss */
.title{
    display: flex;
    align-items: center;
}

以下是原内容

navigationStyle(官方文档)设置为custom后，导航栏消失，可以自定义导航栏。

在不同的手机上，胶囊到屏幕顶部的距离是不一样的，尤其是刘海屏，这个距离会很大。所以自定义导航栏的高度不能写死。页面主体部分不能被右上角的胶囊覆盖；为了美观，自定义导航栏的标题最好也和胶囊在水平上对齐。所以，自定义导航栏的高度需要适配。

- 阅读剩余部分 -

1、前言

JWT是JSON Web Token的简写，是一种可跨域的身份认证方案。

JWT可以让服务器不再维护session等用户状态，只要token有效，就认为是合法的用户。
但是这样也有一个缺点，就是除非token到期，否则服务器没法主动让token失效。
要解决这个问题，可以把每个用户的token保存在redis数据库，每次在token验证为有效后，还要在redis中查询此token是否存在。这样，既能保证这个查询的速度(redis是内存数据库)，也能通过操作redis中的数据，让某些token失效。

- 阅读剩余部分 -

在iOS11上，Safari的webkit内核提供了适配iPhone X的大刘海的功能。

viewport-fit

首先是新增了viewport-fitmeta标签，它有3个值，分别是auto(默认值)、contain和cover。

用法是这样的：

- 阅读剩余部分 -

各种教程在介绍webpack的安装时，为了方便，都使用全局安装的方式：

npm install webpack webpack-cli -g

从webpack v4+版本开始，需要安装webpack-cli，详情见官方文档

然后在package.json的scripts字段中添加如下的命令：

"scripts": {
    "dev": "webpack --参数"
}

接下来，就可以在终端中使用webpack打包了：

npm run dev

- 阅读剩余部分 -

一、简单工厂模式

简单工厂模式，就是在工厂中预先定义了几类具体的产品，你需要一个产品，就请求工厂返回这个产品。如果工厂没有定义这样的产品，是生产不出来的：

- 阅读剩余部分 -

有时需要将现有对象转为 Promise 对象，Promise.resolve()方法就起到这个作用。
http://es6.ruanyifeng.com/#docs/promise#Promise-resolve

一、前言

复习Promise时，发现Promise.resolve()这个方法，于是研究了一下。

二、定义

Promise.resolve(value)方法返回一个以给定值解析后的Promise对象。

- 阅读剩余部分 -

这篇文章记录一种离奇的input事件被触发的情况。

最近在开发小程序时，遇到了很奇怪的情况。当时wxml结构如下：

<view>
    <input bindinput="input" />
    <view class="clear" bind:tap="clear"></view>
</view>

input组件和.clear组件是没有相互覆盖的。

- 阅读剩余部分 -

在<input type="number">输入框中，除了可以输入数字，还可以输入-(负号)、.(小数点)、e(指数符号)。在Vue开发移动端应用时，如果想要控制用户仅仅可以输入数字，最好的办法就是使用watch:

...
watch: {
    inputVal(newVal){
        // 在这里检查、过滤newVal
    }
}
...

- 阅读剩余部分 -

目前，能够提供Vue文件格式化的插件只有Vetur。Vetur对Vue中的JavaScript，内置了3种格式化工具，默认的是prettier，它对HTML和JavaScript，默认都是过长的行自动换行，JavaScript中换行的情况更多，比如链式调用、参数列表等等。

- 阅读剩余部分 -

马上就2020年了，作为一个有多年工作经验的前端开发，竟然不知道移动端浏览器支持小于12px的font-size设置。

可能是思维定势，PC端的浏览器对字体大小有限制，就认为移动端同样有限制，竟然没有亲手试试，真是太不应该了。并且，前端同事都是这样认为的……

- 阅读剩余部分 -