169 похожих чатов

Пожалуйста, помогите вычислить в коде переменную delimiter. Этот код нужен

для компонента, который умеет запрашивать у Api необходимое разрешение картинки под
разрешение устройства пользователя, передавая параметр imageWidth. В принципе, из комментариев понятно чего я хочу.
const deviceSizes = [300, 400, 500, 600, 700, 800, 900, 1150]; // из файла констант (настройка размеров экранов), по нему библиотека будет формировать srcset
для браузера

// это Реакт компонент

const AdaptiveImage = ({
delimiters = [1,1,1], // это будет приходить из пропсов. так я буду задавать в каком соотношении к ширине экрана будет картинка в зависимости от типа устройства
src,
width,
height,
alt,
...rest
}) => {

// например delimiters = [1, 1, 2];
// 1 - означает, что картинка будет на весь экран на мобилах
// 1 - на планшетах тоже на весь экран
// 2 - на пол-экрана будет картинка на десктопах

// этот хук получает ширину экрана в пикселях, а также тип текущего устройства
const {
width: screen, isMobile, isTablet, isDesktop,
} = useAdaptive();

const delimiter = // ??? например isDesktop = true, тогда должен быть равен 2 - согласно [1, 1, 2] (на пол-экрана картинка)

// соотношение ширины и высоты картинки, чтобы рассчитать правильно пропорции
const ratio = width / height;

// подсчитанная ширина (разрешение) изображения под размер экрана пользователя
const adaptiveWidth = deviceSizes.reduce((prev, curr) => (Math.abs(curr - screen) < Math.abs(prev - screen) ? curr : prev));

// подсчитанная необходимая высота картинки, чтобы сохранить пропорции
const adaptiveHeight = adaptiveWidth / ratio;

return (
<Image
loader={({ src: imageSrc, width: imageWidth }) => loaderImage(imageSrc, imageWidth)}
src={src}
width={adaptiveWidth}
height={adaptiveHeight}
alt={alt}
{...rest}
/>
);
};

3 ответов

33 просмотра

let delimeter; if(isMobile) { delimeter = delimiters[0] }else if(isTablet){ delimeter = delimiters[1] }else if(isDesktop){ delimeter = delimiters[2] } ну вот так?

N0rda_a Миролюбов
хакер))

Не, по хакерски это вот так delimeters[isMobile * 1 + isTablet *2 + isDesktop * 3] работать будет, но не в коем случае так не делай.

Похожие вопросы

Обсуждают сегодня

а через ESC-код ?
Alexey Kulakov
29
30500 за редактор? )
Владимир
47
Чёт не понял, я ж правильной функцией воспользовался чтобы вывести отладочную информацию? но что-то она не ловится
notme
18
У меня есть функция где происходит это: write_bit(buffer, 1); write_bit(buffer, 0); write_bit(buffer, 1); write_bit(buffer, 1); write_bit(buffer, 1); w...
~
13
Недавно Google Project Zero нашёл багу в SQLite с помощью LLM, о чём достаточно было шумно в определённых интернетах, которые сопровождались рассказами, что скоро всех "ибешни...
Alex Sherbakov
5
program test; {$mode delphi} procedure proc(v: int32); overload; begin end; procedure proc(v: int64); overload; begin end; var x: uint64; begin proc(x); end. Уж не знаю...
notme
6
Как передать управляющий символ в открытую через CreateProcess консоль? Собсна, есть процедура: procedure TRedirectThread.WriteData(Data: OEMString); var Written: Cardinal;...
Serjone
6
вы делали что-то подобное и как? может есть либы готовые? увидел картинку нокода, где всё линиями соединено и стало интересно попробовать то же в ddl на lua сделать. решил с ч...
Victor
8
Ребят в СИ можно реализовать ООП?
Николай
33
Подскажите пожалуйста, как в CustomDrawCell(Sender: TcxCustomGridTableView; ACanvas: TcxCanvas; AViewInfo: TcxGridTableDataCellViewInfo; var ADone: Boolean); получить наз...
A Z
7
Карта сайта