Javascript 将静态图像传递给带有@2x后缀的本地社区滑块

Javascript 将静态图像传递给带有@2x后缀的本地社区滑块,javascript,react-native,Javascript,React Native,我一直有一个问题,我在滑块中传递给thumbImage的图像在不同的android设备上有不同的大小,在一些设备上太大了 所以我决定使用@2x和@3x后缀传递图像,以提供不同屏幕密度的图像 然而,我不知道如何在这种情况下使用它 这是我的部分代码 这是进口货 import HandleActiveIcon from './img/handle-active.png'; import HandleIcon from './img/handle.png'; 传递到滑块的支柱 const Slider

我一直有一个问题,我在滑块中传递给thumbImage的图像在不同的android设备上有不同的大小,在一些设备上太大了 所以我决定使用@2x和@3x后缀传递图像,以提供不同屏幕密度的图像

然而,我不知道如何在这种情况下使用它

这是我的部分代码

这是进口货

import HandleActiveIcon from './img/handle-active.png';
import HandleIcon from './img/handle.png';
传递到滑块的支柱

const Slider = ({
  minimumTrackTintColor = colors.primary,
  maximumTrackTintColor = 'transparent',
  minimumTrackTintColorActive = colors.secondary,
  maximumTrackTintColorActive = 'transparent',
  minimumValue = 0,
  maximumValue = 100,
  initialValue,
  thumbTintColor = colors.secondary,
  thumbTintColorActive = colors.primary,

  thumbImage = HandleIcon,
  thumbImageActive = HandleActiveIcon,

  onSlidingStart = () => {},
  onSlidingComplete = () => {},
  onValueChange = () => {},
  throttleTime = 100,
  step = 10,
}
这就是滑块组件

 <SliderComponent
      style={style.slider}
      minimumValue={minimumValue}
      maximumValue={maximumValue}
      minimumTrackTintColor={
        isActive ? minimumTrackTintColorActive : minimumTrackTintColor
      }
      maximumTrackTintColor={
        isActive ? maximumTrackTintColorActive : maximumTrackTintColor
      }
      thumbImage={isActive ? thumbImageActive : thumbImage}
      value={initialValue}
      onSlidingStart={handleSlidingStart}
      onSlidingComplete={handleSlidingComplete}
      onValueChange={handleValueChange}
      step={step}
    />
不知道以后怎么办

有什么想法吗

多谢各位

.
├── slider.js
└── img
    ├── HandleIcon.png
    ├── HandleIcon@2x.png
    └── HandleIcon@3x.png