场景
最近做一个商城小程序, 服务端没啥问题, 前端这里用户使用过程中要求能够像顺丰小程序一样, 识别地址.
方案一
最简单的方案就是自己撸一套正则, 然后要求用户按照格式输入即可. 这样很快速, 但是容易出问题. 最常见一点, 用户就不按你的规则来咋办? 比如用户的 Excel 表格保存的数据, 可能就保存到地级市, 然后你前端要求精确到"区". 然后你说服务端解决? 显然, 我们这里说的是纯前端方案.
上面就要求用户需要按照: 姓名 [空格] 手机号 [空格] 地址 [空格] 邮编
如果产品可接受, 就拿去用吧.
方案二
找轮子.
本来找了两个, 这个直接引用 bundle.js 即可, 较为方便, 就选它了.
使用方法简单, 如下:
- 拷贝或下载 dist/bundle.js;
- 如果是网页或 npm 使用则直接看README说明即可;
- 小程序引用, 将内容放到本地后, const address_parse = require('path_to/address_parse.min') 文件名自己修改, 比如这里我改成了 address_parse.min.js, require 可省略 ".js". 很重要的一步, 由于是小程序 CommonJS 规范, 而源码是支持网页的, 所以内部会有 window 引用, 所以需要在文件内, 将 window.AddressParse 替换成 module.exports, 否则小程序无法成功调用.
之后就可以愉快的按照文档使用了, 放心, 文档很短.
你也可以不看文档, 仿写这里代码即可:
导出的数据结构是这样的, 请自行解构:
完事
閱讀更多 程序員有點田 的文章