Как правильно написать enum в React Typescript?

Aetae, А я могу как-то ограничить, что бы можно было передать в компонент smartphone или computer? Я вот сделал как в примере выше, но если я передам к примеру smartpho то ошибку не выдаст typescript... а просто подставит в название изображения...

<img src={`/icon/device-${deviceType}-icon.svg`} alt={smartphoneName} />

Как правильно написать enum в React Typescript?

Aetae, Сложно это как-то всё пока что)

Как правильно написать enum в React Typescript?

Aetae, Это тестовые данные, в будущем они будут из API скорее всего)
Я же тогда так сделать не смогу)
Нужно получать именно строку

Как правильно написать enum в React Typescript?

Aetae, Эти данные находятся вообще в другом месте, не в том же файле где enum и interface ( в будущем они могут вообще получатся через API )
Мне бы как-то только строку получать

Как правильно написать enum в React Typescript?

Aetae,
В элементе у меня такой interface и enum

interface IDeviceItem {
  smartphoneName?: string;
  deviceType: DeviceType.smartphone,
}

enum DeviceType {
  smartphone = 'smartphone',
  computer = 'computer'
}

Как правильно написать enum в React Typescript?

Aetae,
Вот такой массив передаю при помощи map пропсами в элемент

const deviceType = [
  {
    smartphoneName: 'Precision 5530',
    deviceType: 'smartphone',
  },
  {
    smartphoneName: 'MS-7A34',
    deviceType: 'computer',
  },
  {
    smartphoneName: 'MS-7A34',
    deviceType: 'computer',
  },
]

{deviceType .map((item, index) => (
     <DeviceItem
            key={`${item}_${index}`}
            smartphoneName={item.smartphoneName}
            deviceType={item.deviceType}
      />
))}

Как правильно написать enum в React Typescript?

WbICHA, Если я напишу "deviceType: DeviceType.smartphone" Я получу точно такую же ошибку

Как правильно написать enum в React Typescript?

WbICHA, Можешь пожалуйста показать как это в принципе должно быть? (мне сказали создать enum для типов девайсов)

Как правильно написать enum в React Typescript?

WbICHA, Возможно, но сказали создать enum для типов устройств, так как знаний в typescript ещё не много, пошёл гуглить, но как это правильно сделать так и не нашёл...
Эти два слова влияют на картинку, раньше они передавались просто через пропс, сказали сделать enum....

Как правильно написать enum в React Typescript?

WbICHA,

Автор, либо используй энум везде, либо нигде:

Мне нужен он только для двух значений smartphone / computer пропса deviceType

Как правильно написать enum в React Typescript?

Aetae, Если честно, что-то я не совсем понял, как это должно работать, у меня есть массив объектов где есть поле deviceType: 'smartphone',
Как мне передать данные в компонент через props где у меня есть interface и enum...

PS. TypeScript учу не давно)

Как правильно написать enum в React Typescript?

Aetae Я туда передаю обьект, где есть поле
deviceType: 'smartphone',

Как правильно такое сверстать?

Denis Melnikov, Гридами можно, но нужно как-то избавится от пустого места...

Как правильно такое сверстать?

Сергей Сергей, Я там оставил ещё пару скринов, не уверен что такое возможно сделать через :nth()

Как правильно такое сверстать?

Сергей Сергей, Количество таких кнопок может стать больше, и тогда медиа запросами не получится...

Как правильно такое сверстать?

Владимир Юрченков, https://codepen.io/Mukzer/pen/vYRpGbO

Как раскодировать кириллические символы?

RAX7, Спасибо тебе большое, столько времени уже потратил, перепробовал разные способы :)

Почему неправильно считается сумма двух минимальных элементов массива?

Спасибо, понял ошибку

Почему неправильно считается сумма двух минимальных элементов массива?

Lynn «Кофеман», Спасибо, понял ошибку

Какие есть способы сделать так, что бы фоновое изображение на разных расширениях было разное?

Сергей Сергей, Как-то так наверное....
Не знаю другого способа...

const wrapper = document.querySelector('.entry')
const oldImg = wrapper.getAttribute('style')
const newImg = wrapper.getAttribute('data-bg')

window.addEventListener(`resize`, event => {
    if (window.innerWidth <= 500) {
        wrapper.setAttribute('style', newImg)
    } else {
        wrapper.setAttribute('style', oldImg)
    }
}, false);