uniapp仿美團小程式左上角的位置定位

2021-10-17 14:29:08 字數 2049 閱讀 4234

**如下(示例):

import qqmapsdk from "@/utils/qqmap-wx-jssdk.js"
位置自己修改。

2.設定自己的**,請求道自己的位置資訊,設定引入位置資訊,引入位置定位,獲取位置相應座標位

獲取位置資訊,經緯度

getlos()

})},

getflo()

);// 解析位址

qqmapwx.

reversegeocoder(,

coord_type:1,

get_poi:1,

poi_options:

"policy=2;radius=1000;page_size=20;page_index=1"

, success:

(res)

=>

, fail:

function

(res))}

,})}

,

注意:

1.我們在獲取位置時候會出現定位失敗圖,這時候我們是因為沒有加許可權資訊加上即可

2.這裡強調一點我在當時引入經緯度時候,賦值到data中,但data結果總是空的,所以我列印一下,發現傳值賦值之後有個重新整理特效,所以我把getflo()的函式呼叫放在了獲取之後呼叫,這樣解決了好多bug,有好方法可以替換

3.設定搜尋框,讓其有個搜尋定位功能

html

<

!-- 搜尋框 --

>

'search'

>

'search_box'

>

'text' class=

'search_input' placeholder=

'搜尋地點' placeholder-class=

'input_placeholder' @input=

"bindinputschools"

v-model=

"bindinputschool"

>

<

/input>

<

/view>

<

/view>

"devs"

>

"flt"

>

}<

/view>

"fls" @click=

'getlos'

>重新定位<

/view>

<

/view>

'btn1' bindtap=

'backtap2'

>

<

/view>

'btn2' v-

for=

"item in poislist"

>

"mapse(item.title)"

>

}<

/view>

<

/view>

<

/view>

js

bindinputschools

(e))

; console.

log(e)

var timer = false;

var val = e.detail.value;

let vm = this

cleartimeout

(timer)

; timer =

settimeout

(function()

, success:

function

(res),}

);}else},

500);}

,

效果圖

仿美團pc,koa ssr(六)

一,地點詳情頁 product.vue元件,點選h3標題,跳轉到對應地點的詳情detail路徑 商品 rate v model meta.rate colors ff9900 ff9900 ff9900 disabled v if meta.rate 4 class s item comment 很...

仿美團pc,koa ssr(四)

一,城市服務功能 components 新建changecity目錄 新建isselect.vue元件 按省份選擇 select v model pvalue placeholder 省份 option v for item in province key item.value label item...

react native高仿美團V1 1

v1.1目前在v1的基礎上稍作修改,如猜你喜歡介面的排版布局和目前真實的美團是幾乎一樣的 需要注意的是 新客減4元 這個黃色小框是根據不同情況來處理的,在返回的json中的字典中可能有或沒有這個鍵,所以要判斷一下 具體功能封裝了乙個function rendercampaigntag campaig...