• uniapp 请求附近地址列表


    <template>
    	<view class="content">
    		
    			 <map 
    				:latitude="latitude"
    				:longitude="longitude"
    				style=" 100%; height: 40vh"
    				scale="15" 
    				:show-location="true"			
    				@updated="mapUpdated"
    				>
    			</map>			
    			<view class="section">
    			  <input @confirm="bindInput" @input="bindInput" placeholder="输入地址搜索" focus="true" />
    			</view>
    			<view style="height: 50vh;overflow-y: scroll;" class="">				
    				<view @click="choose(index)"  class="plr20" v-for="(item,index) in tips" :key="index">
    					<view class="fs30 C333 mt30">
    						{{index+1}}.{{item.name}}
    					</view>
    					<view v-if="!Array.isArray(item.district)" class="fs26 C999">
    						{{item.district}}
    					</view>
    				</view>
    			</view>
    	</view>
    </template>
    <script>
    import amap from '@/node_modules/amap-wx/amap-wx.js';
    
    export default {
    	data() {
    		return {
    			longitude: 113.947877,
    			latitude: 22.537367,
    			mapInfo: [],
    			markers: [],
    			mapKey: '3fa6b9b58d83770d7af69548e4f9feb8',
    			pois:[],
    			tips:[],
    			address_name:"",
    			address_phone:"",
    			from:""
    			
    			
    		}
    	},
    	created(){
    	
    	},
    	 onLoad(options) {
    		if(options.from == 'sc'){
    			this.from=options.from
    			this.address_name=options.address_name
    			this.address_phone=options.address_phone
    		}
    		//
    		this.amapPlugin = new amap.AMapWX({
    			key: this.mapKey  
    		});
    	
    	
    
    		const that = this
    		that.amapPlugin.getRegeo({
    			type: "gcj02", 
    			success: function(res) {				
    				that.pois=res[0].regeocodeData.pois
    				console.log(that.pois)
    				const latitude = res[0].latitude;
    				const longitude = res[0].longitude;
    				that.longitude = longitude;
    				that.latitude = latitude;
    				that.mapInfo=res[0];
    				console.log(res[0].latitude)
    				console.log(res[0].longitude)
    			},
    			fail: (res) => {
    				console.log(JSON.stringify(res));
    			}
    		}); 
    
    	},
    	
    	onShow(options) {
    		
    	},
    	methods:{
    		choose(index){
    			console.log(this.tips[index].name)
    			console.log(this.tips[index].district)
    			console.log(this.tips[index].location)
    			let addressName = this.tips[index].name
    			let points2 = this.tips[index].location
    			uni.redirectTo({
    				url:"/pagesC/pages/address/addAddress?addressName="+addressName+"&points2="+points2 + "&address_name="+this.address_name+"&address_phone="+this.address_phone
    			})
    			
    		},
    		bindInput: function(e){			
    		    var that = this;
    		    var keywords = e.detail.value; 
    			console.log(keywords)
    		    // var key = config.Config.key;
    		    var myAmapFun = new amap.AMapWX({key: '3fa6b9b58d83770d7af69548e4f9feb8'});
    		    myAmapFun.getInputtips({
    		      keywords: keywords,
    		      location: that.longitude + ',' + that.latitude,
    		      success: function(data){
    				  that.tips=data.tips
    				  console.log(that.tips)
    		      },
    			  fail:err=>{
    				  console.log(err)
    			  }
    		    })
    		  },
    		  bindSearch: function(e){
    		    
    		  },
    		//    点击标记时触发
    		markertap(){
    			
    		},
    		//mapUpdated
    		mapUpdated(){
    			
    		},
    		//
    		closeMapMarker(){
    			
    		},
    		
    		//
    	}
    }
    	</script>
    
    <style>
    @import url('/common/commonCss/dfcCommon.css');
    view {
    	box-sizing: border-box;
    }
    page{
    	background-color: #ffffff;
    	color: rgb(102, 102, 102);
    }
    
    .section{
      height: 30px;
       100%;
    }
    .section input{
      90%;
      margin:5px auto;
      border:1px solid #c3c3c3;
      height:30px;
      border-radius: 3px;
      padding: 0 5px;
    }
    .text_box{
      margin: 10px 25px;
      border-bottom:1px solid #c3c3c3;
      padding-bottom:10px
    }
    
    </style>
    

      

  • 相关阅读:
    并发编程bug的源头
    lambda表达式
    如何学习并发编程
    开篇词
    试述软件的概念和特点?软件复用的含义?构件包括哪些?
    软件生存周期及其模型是什么?
    一台客户端有三百个客户与三百个客户端有三百个客户对服务器施压,有什么区别?
    在搜索引擎中输入汉字就可以解析到对应的域名,请问如何用LoadRunner进行测试。
    给你一个网站,你如何测试?
    你在测试中发现了一个bug,但是开发经理认为这不是一个bug,你应该怎样解决?
  • 原文地址:https://www.cnblogs.com/daifuchao/p/13374378.html
Copyright © 2020-2023  润新知