• В чём ошибка js?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Ни в чём. Ошибка у тебя скорее всего в html, который ты не привёл.
    // разве что чтоб шаблоны в строках работали надо использовать ` а не ".
    Ответ написан
    3 комментария
  • Как сделать так чтобы inline фоновая картинка была видна только в дочерних блоках?

    Aetae
    @Aetae
    Тлен
    Боль-мене универсально с помощью clip-path и трюка с позиционированием:
    Ответ написан
    Комментировать
  • Как поменять через React-код background-image в зависимости от условия if-else?

    Aetae
    @Aetae
    Тлен
    Во-первых: зачем ты лезешь в dom руками через ref? Пиши в state и используя значение в свойстве style компонента. Или даже не в state а тупо в переменную.

    Во-вторых: чтобы сборщик обработал картинку из хрен пойми откуда - надо её импортировать через import и уже потом подставлять результат.
    Однако если картинка лежит в public, это не обязательно, можно прям на неё ссылаться от корня. Только посмотри где она действительно лежит: если лежит в /public/img/morning.jpg, то писать надо соответственно '/img/morning.jpg без всяких assets и наоборот.
    Ответ написан
    Комментировать
  • Как изменить переменную (массив) из другого модуля в javascript?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Это так и работает. Массив передаётся по ссылке. Задача решена.

    P.S. Проблемы тут могут возникнуть только при работе с многопоточностью в node, где в каждом потоке своя версия модуля, либо в случае если в дереве зависимостей окажется несколько разных версий. Но это отдельные случаи и задачи.
    Ответ написан
    Комментировать
  • Как выполнить действие до события DomContentLoaded?

    Aetae
    @Aetae Куратор тега Vue.js
    Тлен
    Нет. (с оговорками, но не в твоём случае)

    Просто измени шаблон index.template.html и добавь туда в head тупо
    <script>
    window.YandexRotorSettings = {
            WaiterEnabled: true;
            FailOnTimeout: false;
            NoJsRedirectsToMain:true
    }
    </script>

    (ну либо любой иной шаблон в который ты подключаешь vue)
    Ответ написан
  • Зависает на запросах после сборки через webpack?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Возможно дело в том что не вынесены node модули как внешние:
    const nodeExternals = require('webpack-node-externals');
    {
      // ...
      externals: [nodeExternals()],
    }


    Если это не поможжет, то отключи все плагины и оптимизацию.
    Не заработало?
    Сделай тестовый файлик с одним единственным методом, собери и посмотри на результирующий код - подебаж его руками и разберись в чём дело.

    Работает?
    Подключай плагины по одному пока не найдёшь виновника и разбирайся с конфигом оного.
    Ответ написан
  • Как правильно сделать привязку данных к динамически созданному элементу в Vue?

    Aetae
    @Aetae Куратор тега Vue.js
    Тлен
    Если работаешь с vue - тебе не нужно трогать dom руками и наоборот.
    v-html только для статических каких-то данных.

    Вот это вот <b class="aaakjhij" data="hk">jjj!!!!</b> должно быть уже в шаблоне. Если надо по условию - то использовать v-if или v-for если несколько.
    Примерно так:
    <script>
    export default {
      data() {
        return {
          data: 'hk',
          text: 'jjj!!!!',
          show: false
        }
      },
      methods: {
        _jjj(){
          this.show = true
          this.data = 'hk';
          this.text = 'jjj!!!!';
        },
       _kkk(){
          this.data = 'ooooooooooo';
          this.text = 'ha-ha-haaaa!!!'
        }
      }
    }
    </script>
    
    <template>
      <div>
        <b v-if="show" :data="data">{{text}}</b>
      </div>
      <button @click="_jjj">11</button>
      <button @click="_kkk">12</button>
    </template>

    Тебе надо перестать мыслить в jquery и начать мыслить в vue.

    Если всё ещё остаются проблемы - опиши конкретную конечную цель, которой ты хочешь добиться, не в виде кода, а в виде результата и условий.
    Ответ написан
    3 комментария
  • Как в react-router-dom сделать чтобы loader не блокировал рендер страницы?

    Aetae
    @Aetae
    Тлен
    Сам не пользовался, но по докам вроде никаких магических параметров не вижу.

    Вот тебе тогда вспомогательные функции которые сделают то, что тебе надо:
    import { json, useLoaderData } from "react-router-dom";
    import { useEffect } from "react";
    
    export function eagerLoader(loader) {
      return (...args) => {
        const promise = loader(...args)
          .then(res => res instanceof Response ? res.json() : res );
        return json({ promise }, { status: 200 });
      }
    }
    
    export function useEagerLoaderData(defaultData) {
      const [data, setData] = useState(defaultData);
      const promise = useLoaderData()?.promise;
    
      useEffect(() => {
        promise?.then(setData);
      }, [promise]);
    
      return data;
    }
    let route = {
      path: "...",
      loader: eagerLoader(({ request }) => ...),
      lazy: () => import("./Comp"),
    };
    
    const Comp = () => {
      const data = useEagerLoaderData([]);
    
      //...
    }

    Код не проверял, но думаю логика очевидна.:)

    P.S. defaultData мб стоит вынести в обёртку eagerLoader, хз, тут сам смотри свои юзкейсы.:)
    Ответ написан
    1 комментарий
  • Как сделать закругленну обводку текста?

    Aetae
    @Aetae
    Тлен
    Как-то так:
    -webkit-text-stroke: 15px rgb(18, 235, 203);
    paint-order: stroke fill;

    Работает только в свежих версиях браузеров.

    Для старья можно попробовать имитировать с помощью svg-фильтра: morphology dilate и заполировать gaussianblur, но там придётся поиграть со значениями.
    Ответ написан
    Комментировать
  • Как сделать типизацию под случай undefined в объекте?

    Aetae
    @Aetae Куратор тега TypeScript
    Тлен
    Никак. Тип undefined не может быть ключом в принципе.
    Из вариантов:
    1. Убедиться что ключ не undefined руками:
    card = card_id && this.cards[card_id];
    2. Заставить ts думать, что ключ есть даже если его нет(и взять на себя ответственность за возможные ошибки):
    card = this.cards[card_id!];
    3. Явно привести к строке:
    card = this.cards[String(card_id)];
    Ответ написан
    5 комментариев
  • Как остановить выполнение функции при нажатии на input?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    var timeoutId;
    // ...
    timeoutId = setTimeout(...
    // ...
    timeoutId = setTimeout(...
    // ...
    function stop() {
      clearTimeout(timeoutId);
    }
    document.getElementById("placeholder_text").click = stop;


    Ну и не называй функцию do, есть ключевое слово do ... while.
    Ответ написан
    Комментировать
  • Можно ли перенести Windows 10 на новый комп, сохранив все настройки?

    Aetae
    @Aetae
    Тлен
    Собственно два нормальных варианта и миллион через жопу.

    1. Самый простой, но может не завестись - вставить hdd в новый комп и надеяться на лучшее. Если меняешь intel на amd или наоборот - шансы понижаются.
    // Работоспособности добиться можно в принципе в любом случае, даже если не заведётся, но тут уж придётся серьёзно повозиться(говорю на своём опыте).

    2. Более-менее гарантированый - воспользоваться стандартной функцией резервного копирования винды: Панель управления\Все элементы панели управления\Резервное копирование и восстановление\Создание образа системы
    Потом с загрузочной флешки: Поиск и устранение неисправностей\Дополнительные параметры\Просмотреть другие параметры восстановления\Восстановление образа системы
    Ответ написан
    6 комментариев
  • Как вырезать в path прозрачное отверстие при помощи того же path?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Просто закрываешь один path и рисуешь дырку в продолжение.
    Примерно так:


    На canvas это можно сделать с помощью параметра fill evenodd:
    Ответ написан
    5 комментариев
  • Set-Cookies не работает в браузере, а в Postman работает, как сохранить куки в браузере?

    Aetae
    @Aetae
    Тлен
    Всё сохраняется, но домен localhost != localhost:7048 != localhost:3000.
    Все запросы к соответствующему домену localhost:7048 будут иметь нужный куки.

    Если на проде и api и основной сайт будут на одном домене, без разделений - используй встроенный dev server proxy, чтобы и при локальной разработке они тоже были одним, проксируя запросы на localhost:7048 с localhost:3000.

    Если на разных и авторизация должна работать по типу SSO - не используй куки и вообще не пили свой велосипед, используй готовые реализации oauth и для бэка и для фронта.
    Ответ написан
  • Почему приложение не билдится из-за vue-yandex-maps?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Я, как и сборщик, не вижу экспорта yandexMap и yandexMarker, вижу YandexMap и YandexMarker.
    Ответ написан
    2 комментария
  • Почему некоректно обновляется ширина в кастомном хуке?

    Aetae
    @Aetae
    Тлен
    Классика: ты этот width наверняка присваиваешь какому-то элементу. Соответственно, ширина этого элемента становится ровна width. Когда ты меняешь ориентацию - ты не убираешь width перед этим, а значит innerWidth окна не минимальное значение, а то, какое получилось с учётом элемента с width, который это окно распирает.
    Т.е. после каждого увеличения width, window.innerWidth не может быть меньше чем width.

    Такие задачи принято решать вёрсткой.
    Ответ написан
    2 комментария
  • Как изменить скрипт сайта через js?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Если вопрос на самом деле: "Почему из расширения не доступны глобальные переменные и функции?", то ответ - потому что расширения работают через слой безопасности, чтобы тебя случайно не взломали через твоё расширение.

    Как добраться до глобальных переменных через этот слой - зависит от конкретного браузера. Читай документацию.

    Универсальный подход(при отсутствии CSP) - просто добавить на страницу script с нужным содержимым. Примерно так:
    function runInScript() {
      // здесь везь код, независимый от иных функций
      document.loremipsum()
    }
    
    
    
    document.head.append(
      Object.assign(
        document.createElement('script'),
        {
          innerHTML: `(${runInScript.toString()})()`,
          onload() { this.remove() }
        }
      )
    );
    Ответ написан
    Комментировать
  • Как избежать скачков header с использование scroll и transform?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Если использовать position: sticky в css, который именно для этого и предусмотрен, нельзя, то сделай так чтоб было можно. Потому что это единственный реально адекватный вариант, а какие-то там проблемы с твоим overflow - это твой косяк, который и надо решать.

    С программным изменением позиции оно всегда будет "дёргаться" без вариантов. До того как появилось sticky - это решали хитрой вёрсткой, где "на самом деле" никакая позиция не меняется, а fixed(а ещё раньше absolute) дубликат элемента показывали\скрывали по условию.

    P.S. Возможно можно что-то плавное изобразить при помощи requestAnimationFrame и getBoundingClientRect, не привязываясь к событию scroll, но не пробовал ибо не нужно.
    Ответ написан
  • Как сделать рендер только один раз?

    Aetae
    @Aetae
    Тлен
    Обернуть App в memo. Ток прям один раз всё равно не получится: один рендер на отображение пустых users, второй на отображение заполненных когда те загрузятся.
    Ответ написан
    Комментировать
  • Отображение содержимого pdf файла на сайте?

    Aetae
    @Aetae
    Тлен
    Можно взять pdf.js и допилить как тебе надо. Будет жирно и тяжело.
    Либо моджно сохранить pdf как набор картинок и просто положить их на сайт. Будет просто и жирно.
    Ответ написан
    4 комментария