有没有一种方法可以把样式化的组件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)