• Как отследить появление autofill-подсказок к полям формы?

    @romaro Автор вопроса
    В общем, я пока вышел из положения способом, который порекомендовал один из ответивших в этом топике:
    const onFocus = (ev: FocusEvent) => {
      (ev.currentTarget as HTMLInputElement)?.removeAttribute('readonly');
    };
    
    <input
      ...
      onFocus={onFocus}
      readOnly
     />


    То есть все мои инпуты по умолчанию readonly. Это позволяет отсекать автоподсказки при загрузке страницы, но не лишаться их при помещении курсора в поле ввода.
    Ответ написан
    Комментировать
  • Почему typescript не видит перегрузку?

    @HealSpirit
    Можно сделать защитников типа:
    interface INavDataBase {
      name: string;
      link: string;
    }
    
    interface INavDataChilds {
      name: string;
      children: INavDataBase[];
    }
    
    type TNavData = INavDataBase | INavDataChilds;
    
    export const navData: TNavData[] = [
      {
        name: "Название меню 1",
        link: "path_to_page",
      },
      {
        name: "Название меню 2",
        children: [
          {
            name: "Название меню 1",
            link: "path_to_page",
          },
          {
            name: "Название меню 2",
            link: "path_to_page",
          },
        ],
      },
    ];
    
    // Здесь можно по разному проверять и hasOwnProperty или "link" in navData
    export const isNavDataBase = (navData: TNavData): navData is INavDataBase =>
      navData.hasOwnProperty("link");
    
    export const isNavDataChilds = (navData: TNavData): navData is INavDataChilds =>
      navData.hasOwnProperty("children");
    
    navData.forEach((data) => {
      if (isNavDataBase(data)) {
        // Здесь будет автокомплит при обращении - data.link
      } else {
        // И здесь, хотя второго защитника мы не использовали - data.children
      }
    });
    Ответ написан
    Комментировать
  • Как изменить имя скачиваемого файла?

    black1277
    @black1277
    Вольный стрелок
    Атрибут download соблюдается только на ресурсах с тем же доменом.
    Ссылка на документацию https://developer.mozilla.org/ru/docs/Web/HTML/Ele...
    Был похожий вопрос

    Как изменить имя скачиваемого файла?. Там у автора вроде, получилось через XMLHttpRequest
    Ответ написан
    2 комментария
  • Зачем нужны скобки в данном случае?

    firedragon
    @firedragon
    Не джун-мидл-сеньор, а трус-балбес-бывалый.
    ({a, b, c} = {a:1, b:2, c:3 }) // вези меня браузер! Ну если внутри ничего нет то попытаемся


    let {a, b, c} = {a:1, b:2, c:3 } // слева переменная, справа значения которые в нее нужно положить. Да Повелитель!
    Ответ написан
    3 комментария
  • Расскажите пожалуйста, что может произойти, если ответвить ветку от родительской с текущим кодом, а потом изменить родительскую ветку?

    delphinpro
    @delphinpro
    frontend developer
    Конфликты могут возникнуть, если в обеих ветках были изменены одинаковые участки кода, и гит не смог самостоятельно определить, какой вариант следует оставить.
    Тогда вы должны будете при слиянии вручную разрешить конфликты (по сути отредактировать конфликтные файлы, в которые гит вам накидает по две версии кода) и застейджить их.
    Ответ написан
    Комментировать
  • Npm init не работает, как исправить?

    black1277
    @black1277
    Вольный стрелок
    Идете в папку C:\Program Files\nodejs\ там находите 4 файла npm.cmd, npm, npx.cmd, npx - открываете их в редакторе и заменяете prefix -g на prefix --location=global Мне это помогло. Если что - вот ссылка на issues в библиотеке npm https://github.com/npm/cli/issues/4980
    Ответ написан
    6 комментариев
  • Как добавлять класс при скороле?

    hahenty
    @hahenty
    ('•')
    Вместо прозрачности ставится что угодно.
    Ответ написан
    Комментировать
  • Как сделать реально адаптивную волну между блоками (svg, clip-path)?

    RAX7
    @RAX7
    Лучше фоновое изображение засунуть в svg и сделать маску.
    Либо так:
    (с пропорциональным увеличением)

    либо:
    (с фиксированной высотой)

    Также с помощью медиа-запросов можно совместить оба эти варианта
    Ответ написан
    1 комментарий
  • Как сделать так чтобы антивирусник перестал удалять posinstall.js?

    firedragon
    @firedragon
    Не джун-мидл-сеньор, а трус-балбес-бывалый.
    Вполне может быть. Какой то деятель встроил определение по Ip и стирал файлы при установке его пакета.
    Так что проверьте все на виртуалке. Если нормально то отключите антивирус и установите потом включите его.

    Второй вариант ставить гилп не последней версии а более старой.

    Кстати желательно прилагать текст сообщения и название антивируса и версию nodejs
    Ответ написан
    Комментировать
  • Как правильнее создавать инстанс класса, все инициализирующие методы которого будут выполнены только внутри самого класса?

    black1277
    @black1277
    Вольный стрелок
    Сделайте класс со статическими методами и свойствами, но не используйте это
    new Geomap( {} );
    потому что по завершении всех функций - созданный объект будет удален. Можно, конечно сделать внутри вечно ожидающие кэлбеки, которые через замыкание будут держать объект в памяти, но для чего это нужно я не представляю - проще использовать тогда паттерн модуля, вместо класса.
    Ответ написан
    2 комментария
  • Почему не работает redirect?

    @ArieX
    ты перед этим уже отправляешь ответ res.send(req.body)
    редирект это чисто ответ на запрос с специальным хейдером, т.е. фактически ты сейчас пытаешься отправить ответ на запрос, хотя до этого уже на него ответил
    не лучше ли редирект сделать на стороне клиента?
    Ответ написан
    1 комментарий
  • Можно ли в VScode добавить кастомную область с кнопками?

    Geminix
    @Geminix
    Фуллстек nuxt, .net разработчик
    Комментировать
  • Почему в cacl не работает деление между vh и vw?

    Lynn
    @Lynn
    nginx, js, css
    Читаю доки вслух и с выражением:

    https://developer.mozilla.org/ru/docs/Web/CSS/calc

    /
    Деление. Делитель должен быть <number>.


    100vw это не <number>.
    Ответ написан
    Комментировать
  • Как отменить несколько коммитов в форкнутом репозитории?

    vabka
    @vabka
    Токсичный шарпист
    git clone <адрес твоего форка>
    cd <...>
    git reset <commit hash того коммита, до которого хочешь откатиться>
    # можно оставить всё в мастере, но тогда надо предыдущую команду вызывать с --hard и сделать потом git push --force
    # а можно создать новую ветку через git branch и git checkout и потом запушить её через git push
    Ответ написан
    1 комментарий
  • Какую книгу прочитать по JavaScript со средним уровнем знания js?

    black1277
    @black1277
    Вольный стрелок
    Прочитайте серию книг "Вы пока еще не знаете JS" Кайла Симпсона, есть издания 2022г.
    Ответ написан
    Комментировать
  • Как обмениваться переменными между React и JS?

    delphinpro
    @delphinpro
    frontend developer
    между React и JS

    Если вы не понимаете, что react и js это почти одно и то же (реакт по сути надмножество javascript), то у меня для вас очень плохие новости.


    Как бы перекинуть массив в React из JS, но так, чтобы и через JS я мог его изменить?


    Глобальный скоуп еще никто не отменил.

    window.MY_VAR = 123;

    в реакте

    console.log(window.MY_VAR); // 123
    Ответ написан
    1 комментарий
  • Правильно ли реализован класс для работы с базой данных по принципу SOLID?

    ipatiev
    @ipatiev Куратор тега PHP
    Потомок старинного рода Ипатьевых-Колотитьевых
    Во-первых, это никакой не DatabaseManager , а CRUDManager. Работа с БД далеко не ограничивается этими 4 примитивными функциями.

    Отсюда мы делаем логичный вывод, что соединение с БД никаким местом не должно создаваться в конструкторе менеджера крудов. А должно точно так же передаваться в него в качестве зависимости. Это может быть либо ванильная ПДО, либо инстанс реального MySQLDatabase (но поскольку мы пока не знаем, как он должен выглядеть, то лучше остановиться на PDO).

    Сам по себе DatabaseManager выглядит избыточным. Непонятно, зачем он нужен, если любой потребитель DatabaseManager-а может просто написать
    public function __construct(CRUDInterface $crud) {
    }

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

    В-четвёртых, хоть это и не относится напрямую к теме SOLID, но для меня является очень важным: собственно, реализация методов CRUD-а. Что в них передаётся? Откуда берутся названия таблиц, полей? Передаются в параметрах методов? Это прямая дорога к SQL инъекции, не говоря уже о нарушении инкапсуляции. Поэтому, отвечая на вопрос "Как вы реализуете работу с базой данных", лично я всё больше в последнее время от развесистых ORM-ов склоняюсь к простым TableGateway-ам. Да, кода писать больше, но он строже и понятнее. И не встаёт колом в нестандартных ситуациях. Тем более что приведённый пример кода как раз очень и похож на этот паттерн. То есть
    abstract class MysqlTableGateway implements CrudInterface
    {
        protected $db;
        protected $table;
        protected $fields;
        protected $primary = 'id';
    
        public function __construct(\PDO $db)
        {
            $this->db = $db;
        }
        public function read($id): ?array
        {
            $stmt = $this->db->prepare("SELECT * FROM `$this->table` WHERE `$this->primary`=?");
            $stmt->execute([$id]);
            return $stmt->fetch();
        }
         // ну и так далее
    }

    И дальше уже классы по работе с отдельными табличками наследовать от него,
    final class UserGateway extends MysqlTableGateway {
        protected $table = 'users';
        protected $fields = ['email', 'password','phone'];
    }

    Соответственно, если мы захотим перейти с мускуля на какой-нибудь редис с джейсоном внутре, то надо будет создать новый абстрактный класс с тем же интерфейсом, и от него отнаследовать реализации. Соответственно, в интерфейсе надо нормально прописать входные и выходные параметры:
    interface CRUDInterface {
        public function create(array $data):int;
        public function read(int $id):?array;
        public function update(array $data);
        public function delete(int $id);
    }

    Другое дело, что в реальности такой шалтай-болтай будет сделать довольно сложно, поскольку классы для работы с отдельными таблицами будут расширяться запросами, специфичными для данной таблицы - то есть все их придется дописывать во все драйверы. То есть в реальности с D будут проблемы. Но чисто с теоретической точки зрения примерно вот так оно будет выглядеть.
    Ответ написан
    4 комментария
  • Как этот сайт запустить? Что для этого нужно? (Язык тут JS + HTML)?

    black1277
    @black1277
    Вольный стрелок
    Ну во-первых, прочитайте что написано в файлах README.md - обычно там записаны инструкции по установке и запуску.
    Во-вторых, нужно будет произвести установку всех зависимостей из файлов package.json - через консоль в каждой из папок набрать npm install , а для этого нужно установить сначала Node.js
    В-третьих, нужно заглянуть в каждый package.json - чтобы узнать какие команды для запуска используются (обычно это npm run start) и соответственно запустить их в каждой из папок (клиент, сервер). (Хотя возможно настроено на запуск единой командой)
    Ответ написан
    3 комментария
  • Методы keys(), values(), entries() находятся в Symbol.iterator у итерируемых объектов?

    Syjalo
    @Syjalo
    Представьте себе бота
    keys(), values() и entries() — методы Map, Set, Array и Object, которые возвращают итератор или массив, у которого есть метод по ключу Symbol.iterator.

    Symbol.iterator — символ, который выступает в качестве ключа (имени) для метода, который возвращает итератор.
    Ответ написан
    1 комментарий
  • Как сохранить select option в localstorage?

    black1277
    @black1277
    Вольный стрелок
    Чтобы при загрузке страницы был выбран сохраненный вариант из списка option, нужно чтобы у нужного варианта был атрибут selected. Пример:
    <select name="nm" id="nam">
      <option value="QBC">QBC</option>
      <option value="QEF">QEF</option>
      <option value="GHI" selected>GHI</option> <!-- этот вариант будет выбран-->
      <option value="KLM">KLM</option>
    </select>

    значит вам нужно в каждом option выводить переменную вместо selected, которая будет либо пустая, либо равна selected (если сохраненное состояние равно выводимому option).
    Добавил рабочий пример, где всё работает (проверял)
    Пример на функциональных компонентах

    import React, { useState, useEffect } from 'react'
    
    const LocalStorage = () => {
      const date = [
        { symbol: 'RU', label: 'рубль' },
        { symbol: 'USD', label: 'доллар' },
        { symbol: 'EUR', label: 'евро' }
      ]
    
      const [curr, setCurrencies] = useState(date)
      const [currentSymbol, setCurrentSymbol] = useState("EUR") // опция выбранная по умолчанию (если нет данных в localstorage)
    
    // срабатывает один раз при загрузке компонента
      useEffect(() => {
        if(localStorage.getItem('symbol')) {
          const item = localStorage.getItem('symbol')
          setCurrentSymbol(item)
        }
      }, [])
    
    // обработчик - срабатывает при выборе опции списка
      const selectHandler = (e) => {
        localStorage.setItem('symbol', e.target.value)
        setCurrentSymbol(e.target.value)
      }
    
      return (
        <div>
          <select onChange={selectHandler} value={currentSymbol}>
            {
              curr.map(currencies => (
                <option key={currencies.symbol} value={currencies.symbol}>
                  {currencies.symbol} {currencies.label}
                </option>
              )
              )
            }
          </select>
        </div>
      )
    }
    
    export default LocalStorage


    на классовых

    import React, { Component } from 'react'
    
    
    class ClassLocal extends Component {
      constructor(props){
        super(props);
        this.state = {
          curr: [
            { symbol: "RU", label: "рубль" },
            { symbol: "USD", label: "доллар" },
            { symbol: "EUR", label: "евро" }
          ],
          currentSymbol: "EUR"
        }
      }
    
    
      componentDidMount() {
        if(localStorage.getItem('symbol')) {
          const item = localStorage.getItem('symbol');
          this.setState({currentSymbol: item})
        }
      }
    
    
      selectHandler = (e) => {
        localStorage.setItem('symbol', e.target.value)
        this.setState({currentSymbol: e.target.value})
      }
    
      render() {
        return (
          <div>
            <select onChange={this.selectHandler} value={this.state.currentSymbol}>
              {
                this.state.curr.map(currencies => (
                    <option key={currencies.symbol} value={currencies.symbol}>
                      {currencies.symbol} {currencies.label}
                    </option>
                  )
                )
              }
            </select>
          </div>
        )
      }
    }
    
    export default ClassLocal

    Ответ написан
    7 комментариев