vue项目实现地址自动识别功能

1、安装第三方依赖

npm install address-parse

2、在需要使用的页面引入

import AddressParse from 'address-parse';

3、在页面上写入静态的html代码，可以输入地址，加上识别的输入框；

    
    
      识别
    

4、点击识别按钮，触发地址解析的方法，把返回结果一对一赋值。

parseAddress() {
  /*判断解析的地址内容不为空*/
  if (this.message != '') {
    const result = AddressParse.parse(this.message);
    this.name = result[0].name;
    this.phone = result[0].mobile;
    this.area = `${result[0].province}-${result[0].city}-${result[0].area}`
    this.areaDetail = result[0].details;
  } else {
    this.$toast('请输入您要识别的地址')
  }
}

5、效果展示。