有没有一种方法可以将样式化的组件/ JSX用作标记元素？

Question

我想做这样的事情：

import styled from 'styled-components'

const Marker = styled.div`...`
const MarkerIcon = styled.svg`...`

const element = (
  <Marker>
    <MarkerIcon />
  </Marker>
)

new mapboxgl.Marker(element)
  .setLngLat([...])
  .addTo(map)

这是可能的，还是您已经使用document.createelement？

Answer 1

解决：

const marker = document.createElement('div')

new mapboxgl.Marker(marker)
  .setLngLat([...])
  .addTo(map)

ReactDOM.render(<Marker />, marker)