情感中的属性选择器

Question

以下代码可自定义Google Maps DrawingManager十字光标。它可以工作，但我希望能够将svg光标作为道具传递。我试图通过情感使它正常工作，但是在情感文档中找不到类似的内容，但是我的尝试失败了。能在情感上做到吗？

代码：此处实际上只有两条相关的行（表示）-其余部分是根据上下文给出的。

import React, { useEffect, useContext } from 'react'
import { GoogleMapContext, MapBox } from '@googlemap-react/core'
import ThemeSwitcher from './theme-switcher'
import styles from './styles/styles'
import './map.css'   <--------------------------------------------------

export default function Map(props) {
    const { state: { map } } = useContext(GoogleMapContext);
    useEffect(() => map && map.setOptions({ draggableCursor: props.cursor }));
    return <>
        <MapBox
            className='crosshair-cursor'          <---------------------
            apiKey={process.env.REACT_APP_GMAPS}
            opts={{
                center: { lat: -37.815018, lng: 144.946014 },
                zoom: 11,
                styles: styles[localStorage.getItem('mapTheme')],
            }}
            useDrawing
            useGeometry
            useGoogleApi
            onClick={props.onClick}
            onRightClick={props.onRightClick}
            LoadingComponent={null}
        />
            <ThemeSwitcher bindingPosition='TOP_LEFT' map={map} />
            {props.children}
    </>
}

map.css：

.crosshair-cursor [style*='crosshair'] {
    cursor: url("https://i.stack.imgur.com/mA4e2.jpg?s=48&g=1")24 24, crosshair !important;
  }

我的尝试

import React, { useEffect, useContext } from 'react'
import { GoogleMapContext, MapBox } from '@googlemap-react/core'
import ThemeSwitcher from './theme-switcher'
import styles from './styles/styles'
import './map.css'
import {css} from '@emotion/core'

const cursor = css`[style*='crosshair'] {
    cursor: url("https://i.stack.imgur.com/mA4e2.jpg?s=48&g=1")24 24, crosshair !important;
}`

export default function Map(props) {
    const { state: { map } } = useContext(GoogleMapContext);
    useEffect(() => map && map.setOptions({ draggableCursor: props.cursor }));
    return <>
        <MapBox
            // className='crosshair-cursor'
            css={cursor}
            apiKey={process.env.REACT_APP_GMAPS}
            opts={{
                center: { lat: -37.815018, lng: 144.946014 },
                zoom: 11,
                styles: styles[localStorage.getItem('mapTheme')],
            }}
            useDrawing
            useGeometry
            useGoogleApi
            onClick={props.onClick}
            onRightClick={props.onRightClick}
            LoadingComponent={null}
        />
            <ThemeSwitcher bindingPosition='TOP_LEFT' map={map} />
            {props.children}
    </>
}