Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
qianlong66
uni-app
提交
d8b7b569
U
uni-app
项目概览
qianlong66
/
uni-app
与 Fork 源项目一致
Fork自
DCloud / uni-app
通知
1
Star
1
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
uni-app
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
d8b7b569
编写于
9月 07, 2022
作者:
DCloud-WZF
💬
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
refactor(h5 map): 优化map control创建方式
上级
3f5b9ed6
变更
3
显示空白变更内容
内联
并排
Showing
3 changed file
with
50 addition
and
65 deletion
+50
-65
packages/uni-h5/src/view/components/map/MapControl.tsx
packages/uni-h5/src/view/components/map/MapControl.tsx
+33
-62
packages/uni-h5/src/view/components/map/index.tsx
packages/uni-h5/src/view/components/map/index.tsx
+4
-3
packages/uni-h5/style/map.css
packages/uni-h5/style/map.css
+13
-0
未找到文件。
packages/uni-h5/src/view/components/map/MapControl.tsx
浏览文件 @
d8b7b569
import
{
inject
,
onUnmounted
,
watch
,
PropType
}
from
'
vue
'
import
{
computed
,
PropType
}
from
'
vue
'
import
{
getRealPath
}
from
'
@dcloudio/uni-platform
'
import
{
defineSystemComponent
,
useCustomEvent
}
from
'
@dcloudio/uni-components
'
import
{
Maps
,
Map
}
from
'
./maps
'
import
{
defineSystemComponent
}
from
'
@dcloudio/uni-components
'
interface
Position
{
left
:
number
|
string
...
...
@@ -12,78 +11,50 @@ interface Position {
const
props
=
{
id
:
{
type
:
[
Number
,
String
],
default
:
''
},
position
:
{
type
:
Object
as
PropType
<
Position
>
,
require
:
true
},
iconPath
:
{
type
:
String
,
require
:
true
},
position
:
{
type
:
Object
as
PropType
<
Position
>
,
require
d
:
true
},
iconPath
:
{
type
:
String
,
require
d
:
true
},
clickable
:
{
type
:
[
Boolean
,
String
],
default
:
''
},
rootRef
:
{
type
:
Object
,
default
:
null
},
trigger
:
{
type
:
Function
,
required
:
true
},
}
export
type
Props
=
Partial
<
Record
<
keyof
typeof
props
,
any
>>
type
CustomEventTrigger
=
ReturnType
<
typeof
useCustomEvent
>
type
OnMapReadyCallback
=
(
map
:
Map
,
maps
:
Maps
,
trigger
:
CustomEventTrigger
)
=>
void
type
OnMapReady
=
(
callback
:
OnMapReadyCallback
)
=>
void
export
default
/*#__PURE__*/
defineSystemComponent
({
name
:
'
MapControl
'
,
props
,
setup
(
props
)
{
const
onMapReady
:
OnMapReady
=
inject
(
'
onMapReady
'
)
as
OnMapReady
let
control
:
HTMLDivElement
function
removeControl
()
{
if
(
control
)
{
control
.
remove
()
}
}
onMapReady
((
_
,
__
,
trigger
)
=>
{
function
updateControl
(
option
:
Props
)
{
removeControl
()
addControl
(
option
)
}
function
addControl
(
option
:
Props
)
{
control
=
document
.
createElement
(
'
div
'
)
const
style
=
control
.
style
style
.
position
=
'
absolute
'
style
.
width
=
'
0
'
style
.
height
=
'
0
'
style
.
top
=
'
0
'
style
.
left
=
'
0
'
const
img
=
new
Image
()
img
.
src
=
getRealPath
(
option
.
iconPath
)
img
.
onload
=
()
=>
{
const
position
=
option
.
position
||
{}
if
(
position
.
width
)
{
img
.
width
=
option
.
position
.
width
const
imgPath
=
computed
(()
=>
getRealPath
(
props
.
iconPath
!
))
const
positionStyle
=
computed
(()
=>
{
let
positionStyle
=
`top:
${
props
.
position
!
.
top
||
0
}
px;left:
${
props
.
position
!
.
left
||
0
}
px;`
if
(
props
.
position
!
.
width
)
{
positionStyle
+=
`width:
${
props
.
position
!
.
width
}
px;`
}
if
(
position
.
height
)
{
img
.
height
=
option
.
position
.
height
if
(
props
.
position
!
.
height
)
{
positionStyle
+=
`height:
${
props
.
position
!
.
height
}
px;`
}
const
style
=
img
.
style
style
.
position
=
'
absolute
'
style
.
left
=
(
position
.
left
||
0
)
+
'
px
'
style
.
top
=
(
position
.
top
||
0
)
+
'
px
'
style
.
maxWidth
=
'
initial
'
control
.
appendChild
(
img
)
props
.
rootRef
.
value
&&
props
.
rootRef
.
value
.
appendChild
(
control
)
}
img
.
onclick
=
function
(
$event
)
{
if
(
option
.
clickable
)
{
trigger
(
'
controltap
'
,
$event
,
{
controlId
:
option
.
id
,
return
positionStyle
})
const
handleClick
=
(
$event
:
Event
)
=>
{
if
(
props
.
clickable
)
{
props
.
trigger
!
(
'
controltap
'
,
$event
,
{
controlId
:
props
.
id
,
})
}
}
}
addControl
(
props
as
Props
)
watch
(
props
,
updateControl
)
})
onUnmounted
(
removeControl
)
return
()
=>
{
return
null
return
(
<
div
class
=
"uni-map-control"
>
<
img
src
=
{
imgPath
.
value
}
style
=
{
positionStyle
.
value
}
class
=
"uni-map-control-icon"
onClick
=
{
handleClick
}
/>
</
div
>
)
}
}
},
})
packages/uni-h5/src/view/components/map/index.tsx
浏览文件 @
d8b7b569
...
...
@@ -14,6 +14,7 @@ import {
useContextInfo
,
useSubscribe
,
useCustomEvent
,
CustomEventTrigger
,
}
from
'
@dcloudio/uni-components
'
import
'
@amap/amap-jsapi-types
'
import
{
callOptions
}
from
'
@dcloudio/uni-shared
'
...
...
@@ -171,7 +172,6 @@ function useMap(
longitude
:
Number
(
props
.
longitude
),
includePoints
:
getPoints
(
props
.
includePoints
),
})
type
CustomEventTrigger
=
ReturnType
<
typeof
useCustomEvent
>
type
OnMapReadyCallback
=
(
map
:
Map
,
maps
:
Maps
,
...
...
@@ -487,6 +487,7 @@ function useMap(
return
{
state
,
mapRef
,
trigger
,
}
}
...
...
@@ -508,7 +509,7 @@ export default /*#__PURE__*/ defineBuiltInComponent({
],
setup
(
props
,
{
emit
,
slots
})
{
const
rootRef
:
Ref
<
HTMLElement
|
null
>
=
ref
(
null
)
const
{
mapRef
}
=
useMap
(
props
,
rootRef
,
emit
as
SetupContext
[
'
emit
'
])
const
{
mapRef
,
trigger
}
=
useMap
(
props
,
rootRef
,
emit
as
SetupContext
[
'
emit
'
])
return
()
=>
{
return
(
<
uni
-
map
ref
=
{
rootRef
}
id
=
{
props
.
id
}
>
...
...
@@ -526,7 +527,7 @@ export default /*#__PURE__*/ defineBuiltInComponent({
<
MapCircle
{
...
item
}
/>
))
}
{
props
.
controls
.
map
((
item
)
=>
(
<
MapControl
{
...
item
}
rootRef
=
{
rootRef
}
/>
<
MapControl
{
...
item
}
trigger
=
{
trigger
}
/>
))
}
{
props
.
showLocation
&&
<
MapLocation
/>
}
{
props
.
polygons
.
map
((
item
)
=>
(
...
...
packages/uni-h5/style/map.css
浏览文件 @
d8b7b569
...
...
@@ -19,3 +19,16 @@ uni-map[hidden] {
left
:
0
!important
;
top
:
0
!important
;
}
.uni-map-control
{
position
:
absolute
;
width
:
0
;
height
:
0
;
top
:
0
;
left
:
0
;
z-index
:
999
;
}
.uni-map-control-icon
{
position
:
absolute
;
max-width
:
initial
;
}
\ No newline at end of file
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录