微信小程序 地址管理

一、展示所有地址  小程序js页面

wx.request({
      url: 'http://www.ment.com/city/city_select',
      data:{
      },
      method:'POST',
      success:function(res){
        console.log(res.data.data)
        that.setData({
            test:res.data.data
          })
      } 
    })

导出地址管理

   citys(res){
    wx.chooseAddress({
      success (res) {
        console.log(res)
        var name=res.userName
        var province=res.provinceName
        var city=res.cityName
        console.log(city)
        var county=res.countyName
        console.log(county)
        var part=res.detailInfo
        var number=res.telNumber
        console.log(number)
        wx.request({
          url: 'http://www.ment.com/city/county_code',
          method:"POST",
          data:{
            name,
            province,
            city,
            county,
            part,
            number
          },
          success:function(res){
            console.log(res)  
          } 
        })
      }
    })

  }

wxml页面

<view wx:for="{{test}}">

<l-card type="primary"
          plaintext="{{true}}"
          title="{{item.name}} {{item.number}}">
    <view class="content">
     {{item.designation}}
      <!-- {{item.city}}{{item.county}}{{item.address}} -->
    </view>
  </l-card>
</view>
<navigator url="/pages/citys/citys"><l-button type="default" bindtap="city">添加按钮</l-button></navigator>
 
 <l-button type="default" bindtap="citys">导出</l-button>

json页面，主要放样式

{
  "usingComponents": {
    "l-card":"/miniprogram_npm/lin-ui/card",
    "l-button":"/miniprogram_npm/lin-ui/button"
  }
}

跳转到添加地址页面

Page({

  /**
   * 页面的初始数据
   */
  data: {
    region: [],// 选中的数据
    name:'',
    designation:'',
    number:''

  },

  bindRegionChange: function (e) {
    console.log(e);
    this.setData({
      region: e.detail.value
    })
    console.log(this.data.region)
  },
  //文本域取值
  bindText(res)
  {
    // console.log(res.detail.value);
    this.setData({
        name:res.detail.value
    })
  },
 
  //成功提交按钮
  buttonAt(){
    let name = this.data.name;
    let region = this.data.region;
    let number = this.data.number;
    let designation = this.data.designation;
   
    console.log(name);
    console.log(region);
    console.log(number);
    console.log(designation);
 
    wx.request({
      url: 'http://www.ment.com/city/county',
      data:{
        name:name,
        region:region,
        number:number,
        designation:designation
        
      },
      success:function(res){
        // console.log(res.data);
        if(res.data.date){
          wx.showToast({
            title: '成功',
            duration: 1000,
            success: function () {
            setTimeout(function () {
            wx.reLaunch({
            url: '/pages/show/show',
              })
            }, 1000);
           }
         })
        }else{
          console.log(2);
        }
      }
    })
  },
  //联系人名称
  designation(designation){
    this.setData({
        designation:designation.detail.value
    })
  },
  //用户手机号码
  number(number){
    this.setData({
      number:number.detail.value
  })
  }

})

添加地址的wxml页面

<view class="designation">
  请输入您的联系名称：
  <l-input label="联系人" bind:lininput="designation" placeholder="名字" name="name"  />
</view>
 
<view>
  <picker mode="region" bindchange="bindRegionChange" value="{{region}}">
      <text wx:if="{{region==''}}">请选择省市区</text>
      <text wx:else="{{region!==''}}">重新选择？</text>
  </picker>
</view>
<view class="inputEn">
  <l-input label="省级"  value='{{region[0]}}' disabled="{{true}}"   placeholder="所选省级"  />
      <l-input label="市级" value='{{region[1]}}'  disabled="{{true}}"  placeholder="所选市级"  />
      <l-input label="区级" value='{{region[2]}}'  disabled="{{true}}"   placeholder="所选区级"  />
 
</view>
<view class="number">
  请输入您的手机号码：
      <l-input label="手机号码" name="number" bind:lininput="number"  placeholder="请输入您的手机号码"  />
</view>
      请输入您的详细地址：
      <l-textarea bind:lininput="bindText"  placeholder="请精确到门牌号" name="designation" />
      <l-message content="{{content}}"/>
      <l-button class="button" bindtap="buttonAt" type="success">成功</l-button>

json页面

{
  "usingComponents": {
    "l-input":"/miniprogram_npm/lin-ui/input",
    "l-textarea":"/miniprogram_npm/lin-ui/textarea",
    "l-message":"/miniprogram_npm/lin-ui/message",
    "l-button":"/miniprogram_npm/lin-ui/button"
  }
}

后台代码

  public function county(Request $request){
        $name['name'] = $request['name'];
        $region = $request['region'];
        $nameen = json_decode($region,true);
        //省
        $name['province']=$nameen[0];
        //市
        $name['city']=$nameen[1];
        //区
        $name['area']=$nameen[2];
        //用户名称
        $name['designation']=$request['designation'];
        //用户手机号码
        $name['number']=$request['number'];
        $isCreate = County::create($name)->ToArray();
        if (!empty($isCreate['id'])){
            return  json(['date'=>$isCreate]);
        }
        dump($isCreate);die();
    }