宫格导航 - 更新日志

1.1.0（2020-05-08）

菜单项的点击方法由改为onClick；（其实并没啥意义，就是顾名思义而已）
新增：菜单项无url和无符合navigator、button的open-type时，视为点击按钮，组件內定义了一个press方法（line 227），页面调用组件时可使用 <component-name @press="methodName">；
新增：组件prop height，设置菜单项宽度；
新增：菜单项跳转、button的open-type、webview跳转等方式
优化：菜单项title支持html；
新增：菜单项设置图标颜色iconColor、标题颜色titleColor;
有朋友说无法成功调用，现在在说明文档补充调用演示，如果不成功，请下载demo查看，或评论区反馈。
删除：属性baseIconFont，当单项中当icon属性设置为字体图标class全称且设置iconfont:true时，使用字体图标作为单项图标。

为避免疏忽，将原本放在App.vue的$rpxToPxFactor调整到组件内部，并更名为rpxToPxFactor ，内部将会调用一次uni.getSystemInfo。

此次更新为修复上一个发布的错漏代码

为避免疏忽，将原本放在App.vue的$rpxToPxFactor调整到组件内部，并更名为rpxToPxFactor，内部将会调用一次uni.getSystemInfo。

更新文档，因不熟发布规则，导致说明文档当成更新日志，抱歉。

本次更新文档说明，之前的表格混乱

宫格菜单导航，实现：

端	支持
Web	√
微信小程序	√

因涉及到计算，依赖于numeral.js，直接安装：

npm i -S-d numeral

这是一个保证准确的前置条件，按照小程序文档的指示：	设备	rpx换算px (屏幕宽度/750)
iPhone5	1rpx = 0.42px	1px = 2.34rpx
iPhone6	1rpx = 0.5px	1px = 2rpx
iPhone6 Plus	1rpx = 0.552px	1px = 1.81rpx

我们可以在App.vue设置比例：

// 根据安全屏幕宽度，设置rpx和px的比例，比例尺参考微信小程序 1rpx=n px
Vue.prototype.$rpxToPxFactor = e.safeArea.width < 375 ? 0.42 : (e.safeArea.width > 375 ? .552 : .5)

注意：如果不设置，默认会直接取iphone,也就是0.5

<ju-navigator-grid element-id="navigatorMenu" :list="menu"/>

属性	类型	必填	默认	可选
element-id	String	√	navigatorMenu	菜单的id，用于设置内部元素当绝对宽高，建议一个页面多个菜单时必填且唯一
list	Array	√	[]	菜单列表
show-name	Boolean	true	是否显示菜单名称
name-field-name	String	title	显示菜单名称的key
base-icon-font	String	字体图标的前置class，对应自己的字体图标库，如果存在不现实图片
icon-field-name	String	icon	图标的key，对应自己的字体图标库
url-field-name	String	url	跳转链接的key
color	String	#666	文本颜色，如果有字体图标会一起设置
row-count	String\|Number	2	总行数
col-count	String\|Number	4	总列数
size	String	60rpx	图标宽高，如果是字体图标，设置为其`font-size`，推荐`rpx`单位
click-feedback	Boolean	true	点击反，点击时会有灰色背景指示
show-scroll-bar	Boolean	true	当出现横向滚动时，是否显示指示条

之前需要这方面的导航，就制作了一个小组件，当前可能还存在不少问题，写的不是很好，请多包涵，如有优化方案，欢迎指教，跪谢。

fixme：目前已知地步的指示滚动条在web端没有小程序端流畅。