Ответы, понравившиеся пользователю Danila232

Как лучше структурировать запросы на React-Query?

Александр @Seasle Куратор тега React

Поработав какое-то время с React Query могу выделить следующие моменты:
1. Не стоит пытаться объявлять все query за один раз - они "подвисают" в приложении и не используются. Это можно увидеть в React Query Devtools.
2. Можете вынести сами запросы в функци на отдельный слой/уровень/файл, и уже в useQuery в queryFn и в useMutation в mutationFn использовать функции.
3. Сложную бизнес-логику можно смело убрать под хук, в котором будете вызывать, обрабатывать и возвращать данные из useQuery/useMutation'а.
4. React Query - библиотека не для работы с запросами, это, по сути, ещё одно хранилище, которое просто хранит результаты Promise-операций.

Ответ написан 26 июн.

Комментировать

Почему не рендерится React-компонент в методе render( )?

Дмитрий Перевозкин @jongallany

Frontend

Ох, сложно на самом деле, я сам Vue разработчик, на React немного работал, но почему у вас в render функции какие-то константы, переменные, деструктуризация? У вас есть state, внутри render используется this.state и получайте доступ куда нужно, для обработки данные создавайте методы и через них проводите операции над массивами, советую к прочтению

UPD:
нашел видимо ошибку const cardDataList = Array.from(this.state);
Вы пытаетесь из this.state сделать массив? Или как?

Видимо нужно const cardDataList = Array.from(this.state.dataCards);

И если заработает

Я честно не компилятор и интерпретатор, но подсказывает что-то что нужно будет вместо:

return(
   <div className='card-main'>
      {cards}
   </div>
)

Сделать:

return(
   <div className='card-main'>
      {...cards} // Тут вам явно нужно будет либо раскрыть с помощью ... либо снова делать .map, 
      // хотя можно было намного короче сделать, но вы учитесь, делайте как можете, поэтому попробуйте так
   </div>
)

Ответ написан 18 апр.

4 комментария

Почему не работают динамические импорты в функции?

LJ322 @LJ322

Ошибка возникает из-за того, что нет переменной translationList. Объявите переменную и уже потом присваивайте ей объект модуля

let moduleObj;
async function checkPageAdress(){
     switch(currentPath){
         case '/index.html':
              moduleObj = await import('/dist/js/languages/index_translate.js');
             break
         case '/services.html':
              moduleObj = await import('/dist/js/languages/services_translate.js');
             break
         default: 
              moduleObj = await import('/dist/js/languages/index_translate.js');
     }

 }
 checkPageAdress()

К функции можете обращаться через moduleObj.translationList

Подробнее можно почитать здесь

Ответ написан 01 апр.

1 комментарий

Как лучше сделать переключение языков на многостр. сайте?(без бэка)?

rPman @rPman

Модифицируй роутер или mod rewrite веб сервера таким образом, чтобы идентификатор выбранного языка был в ссылке (например my.site.com/fr/blablabla ), при отсутствии этого идентификатора проводи проверку по заголовку (например для apache, главное идея). Это позволит в интерфейсе дать пользователю выбор языка и одновременно без этого выбора делать его автоматически.

да, перевод нужно размещать поэлементным и прописывать в своем json.

Так же есть сервисы типа гугла или yandex, устанавливаются на сайт и делают автоматический перевод (не рекомендую)

Ответ написан 27 мар.

7 комментариев

Можно ли уникализировать отправку форм с сайта без cms?

Виктор Кожухарь @vitiok78

Ответ выше про скрытое поле абсолютно верен.
Если же вы по какой-то причине не хотите использовать скрытые поля, то можете просто назначить имя (или value) самой кнопке отправки формы.

<input type="submit" value="save" name="loginForm">

if (isset($_POST['loginForm'])){
    // Код
}

Ответ написан 10 мар.

Комментировать

Можно ли уникализировать отправку форм с сайта без cms?

Александр Карабанов @karabanov

Системный администратор

Можно в форму добавить скрытое поле идентифицирующее форму, а в скрипт отправки проверку наличия этого поля и на основе его содержимого добавление в письмо информации о том какой формой оно было отправлено.

Ответ написан 10 мар.

Комментировать

Безопасно ли получать деньги с биржи Weblancer?

lotse8 @lotse8

Могут легко записать в иноагенты. Люди сроки за лайки и репосты получают.

Ответ написан 26 янв.

Комментировать

Ошибка 404 на GitHubPages, почему?

Сергей Кузнецов @sergey-kuznetsov Куратор тега Git

Автоматизатор

Ваша проблема в том, что готовый проект после компиляции складывается в каталог dist, то есть корень проекта фактически будет в том каталоге. А гитхабу в настройках вы сказали что проект будет лежать в корне самого репозитория. Он его там разумеется не находит и сообщает вам об этом ошибкой 404.

Ответ написан 18 янв.

Комментировать

Не пойму работу Object.assign() для documentElement?

fkk @liaFcipE

> не понимаю, почему не работает 2й.

document.querySelector('.layers__container').style.transform = `rotateX(${moveY})`
document.querySelector('.layers__container').style.transform = `rotateY(${moveX})`

Потому, что ты перетираешь значение style.transform двумя разными значениями, второе заменяет первое.

> метод Object.assign инлайново прописал для documentElement АТРИБУТ style.
Не совсем, он буквально сделал:

document.documentElement.style.prop1 = "value1";
document.documentElement.style.prop2 = "value2";

Сам он ничего не прописывал, это уже логика работы DOM ноды и ее API.
Просто прочти документацию к Object.assign, лучше в отрыве от DOM API, ибо у DOM API и его объектов есть свои магические методы, геттеры, сеттеры и прочее:

> console.log(Object.entries(document.documentElement)) то выведутся все пары ключ+значение

У "простых" объектов - да, но все сложнее. Если посмотреть MDN описание для Object.entries, то можно увидеть, что он отдает только перечисляемые свойства: An array of strings representing the given object's own enumerable string-keyed property keys.

Ответ написан 15 янв.

1 комментарий

Не пойму работу Object.assign() для documentElement?

Ivan Ustûžanin @IvanU7n

nothing interesting here

1) а зачем Object.assign? document.documentElement.style = '--test: 1;' тоже работает, т.к. это прописано в спецификации:

interface mixin ElementCSSInlineStyle {
  [SameObject, PutForwards=cssText] readonly attribute CSSStyleDeclaration style;
};

2) просто объединить два выражения в одну через пробел

Ответ написан 14 янв.

2 комментария

Почему img для :before не работает как надо?

Александр Шемаханов @sh3mahan

что-то вроде веб-разработчика

Добавьте к блоку .name position: relative и отступ от края на ширину аватарки и расстояния до имени. А к псевдоэлементу ::before position: absolute и сместите влево на значения отступа. Таким образом, через свойства top left сможете спозиционировать как вам угодно относительно имени. Пример ниже:

Ответ написан более года назад

Комментировать

Войдите на сайт