• Как показывать только один компонент, который используется несколько раз?

    0xD34F
    @0xD34F Куратор тега Vue.js
    Родитель всегда общий? Если да, тогда добавьте в него свойство, которое будет указывать, в каком из экземпляров вашего компонента надо отображать дополнительные элементы. В качестве значения можно использовать индекс экземпляра, например (не обязательно, также подойдёт какое-нибудь свойство из объектов с данными, на основе которых создаются экземпляры компонента - главное, чтобы значения были уникальными, типа id):

    data: () => ({
      items: [ ... ],
      active: null,
    }),

    <v-xxx
      v-for="(n, i) in items"
      :показыватьДополнительныйКонтент="active === i"
      @переключитьОтображениеДополнительногоКонтента="active = active === i ? null : i"
      ...

    https://jsfiddle.net/kdg4qevp/

    В противном случае создайте наблюдаемый объект, и поместите свойство, указывающее кого отображать, в него:

    const xxx = Vue.observable({ active: null });

    В свой компонент добавьте вычисляемое свойство, значение которого а) определяет необходимость демонстрации дополнительных элементов; б) зависит от свойства наблюдаемого объекта:

    computed: {
      показыватьДополнительныйКонтент() {
        return xxx.active === this.какоеТоСвойствоСУникальнымЗначением;
      },
    },

    <div v-if="показыватьДополнительныйКонтент">
      ...
    </div>

    Также добавьте в свой компонент метод для переключения отображения дополнительного содержимого:

    methods: {
      переключитьОтображениеДополнительногоКонтента() {
        xxx.active = this.показыватьДополнительныйКонтент
          ? null
          : this.какоеТоСвойствоСУникальнымЗначением;
      },
    },

    <button @click="переключитьОтображениеДополнительногоКонтента">
      {{ показыватьДополнительныйКонтент ? 'hide' : 'show' }}
    </button>

    https://jsfiddle.net/kdg4qevp/1/
    Ответ написан
    1 комментарий
  • Как правильно рендерить контент?

    Lastor
    @Lastor
    В чем сила, брат? В ньютонах.
    Если это учебное задание, то оно из двух разных не связанных тем.
    Куда прописывать @click?
    Тем элементам меню, от которых вы хотите реакции от клика.

    При нажатии на определённый элемент меню, должно отображаться определённый контент
    В простом случае достаточно, чтобы в коде были все элементы, возможные для отображения. К каждому из них добавляйте условие при котором он должен отображаться.
    Например:

    spoiler
    <template>
    <MenuSection @click="selectedEl = 1"></MenuSection>
    <MenuSection @click="selectedEl = 2"></MenuSection>
    <div v-if="selectedEl  === 1"></div>
    <div v-if="selectedEl  === 2"></div>
    </template>
    <script setup>
    const selectedEl  = ref(0)
    </script>

    Нужно ли дополнительное свойство active? куда прописывать и как менять его?

    Это не свойство. Это класс, который можно применить по условию.
    Напрмер:
    spoiler
    :class="selectedEl !== 1 ? 'extraClass' : 'extraClass' + ' active'"
    <style>
    .active {
    color: red;
    }
    </style>
    Ответ написан
    Комментировать
  • Как правильно сделать скролл?

    dicem
    @dicem
    По хорошему изначально нужно было правильно лейаут делать, но в твоей ситуации сделай просто отступ снизу у контентной области, какой нибудь padding-bottom: 42px;
    Ответ написан
    Комментировать
  • Как регулировать отступ?

    Fragster
    @Fragster
    помогло? отметь решением!
    если поставить px-12 больше 12

    В дефолтном конфиге до 12 числа идут подряд, потом 14, 16, 20, 24..., сответственно, класса px-13 не будет. рекомендую vs-code с плагином https://marketplace.visualstudio.com/items?itemNam..., тогда для классов будет срабатывать интеллисенс, причем с учетом конфига.
    + начиная с какой-то версии поддерживаются произвольные отступы с указанием класса вида px-[2.5rem] https://tailwindcss.com/docs/adding-custom-styles#... (но не советую увлекаться, в большинстве случаев лучше конфиг покрутить)

    ну и применение flex на кнопке вызывает вопросы.
    Ответ написан
    Комментировать
  • Как правильно перевести объект в массив?

    ProgrammerForever
    @ProgrammerForever
    Учитель, автоэлектрик, программист, музыкант
    Объект и массив - концептуально разные вещи. Массив, как правило, содержит схожие сущности: только строки, только числа, только объекты какого-то класса. Объект же - наоборот, может содержать всё что угодно, и это нормально.
    Если, несмотря на всё, хотите получить значения объекта, то код простой:
    function transleteArray(obj) {
       return Object.values(obj);
    }
    Ответ написан
    3 комментария
  • Как сравнить объекты и найти различия?

    @WaterSmith
    Android-разработчик. Java, Kotlin
    Написать функцию, которая сравнит объекты через isEqual и если они отличаются, сравнит их непосредственно по полям, а в качестве результата выдаст список отличающихся полей. Или, например выдаст мапу содержащую все поля, в качестве ключей и значение true/false обозначающее, отличается поле или нет. Конкретная реализация сильно зависит от вашей задачи.
    Ответ написан
    4 комментария
  • Как сравнить объекты и найти различия?

    vabka
    @vabka
    Токсичный шарпист
    Мне кажется, такой вариант вам может подойти:
    function generateJsonPatch(obj1, obj2) {
      const patch = [];
    
      // Рекурсивно обходим все свойства первого объекта
      for (const prop in obj1) {
        if (obj1.hasOwnProperty(prop)) {
          // Если свойство отсутствует во втором объекте, удаляем его
          if (!obj2.hasOwnProperty(prop)) {
            patch.push({op: "remove", path: `/${prop}`, oldVal: obj1[prop]});
          } else {
            // Если свойство является объектом или массивом, рекурсивно обходим его
            if (typeof obj1[prop] === "object") {
              patch.push(...generateJsonPatch(obj1[prop], obj2[prop]).map(p => {
                p.path = `/${prop}${p.path}`;
                return p;
              }));
            } else {
              // Если значение свойства отличается от значения во втором объекте, обновляем его
              if (obj1[prop] !== obj2[prop]) {
                patch.push({op: "replace", path: `/${prop}`, value: obj2[prop], oldVal: obj1[prop]});
              }
            }
          }
        }
      }
    
      // Обходим свойства второго объекта, которых нет в первом объекте
      for (const prop in obj2) {
        if (obj2.hasOwnProperty(prop) && !obj1.hasOwnProperty(prop)) {
          // Добавляем новое свойство
          patch.push({op: "add", path: `/${prop}`, value: obj2[prop], oldVal: undefined});
        }
      }
    
      return patch;
    }

    Вот что он выдаёт в вашем случае:
    [ { op: 'replace', path: '/colorQty', value: 1, oldVal: 0 } ]


    Код генерировал не я. Я попросил ChatGPT:
    prompt и оригинальный ответ



    Напиши функцию на javascript, которая принимает в себя два js-объекта или массива, на выходе я должен получить jsonpatch, который можно применить к первому объекту, чтобы получился объект идентичный второму

    ... вариант без oldValue ...

    добавь ещё в каждую операцию jsonpatch и старое значение, чтобы при чтении было понятно, что на что заменяется

    Вот обновлённый код функции generateJsonPatch с добавлением старого значения в каждую операцию jsonpatch:

    function generateJsonPatch(obj1, obj2) {
      const patch = [];
    
      // Рекурсивно обходим все свойства первого объекта
      for (const prop in obj1) {
        if (obj1.hasOwnProperty(prop)) {
          // Если свойство отсутствует во втором объекте, удаляем его
          if (!obj2.hasOwnProperty(prop)) {
            patch.push({op: "remove", path: `/${prop}`, oldVal: obj1[prop]});
          } else {
            // Если свойство является объектом или массивом, рекурсивно обходим его
            if (typeof obj1[prop] === "object") {
              patch.push(...generateJsonPatch(obj1[prop], obj2[prop]).map(p => {
                p.path = `/${prop}${p.path}`;
                return p;
              }));
            } else {
              // Если значение свойства отличается от значения во втором объекте, обновляем его
              if (obj1[prop] !== obj2[prop]) {
                patch.push({op: "replace", path: `/${prop}`, value: obj2[prop], oldVal: obj1[prop]});
              }
            }
          }
        }
      }
    
      // Обходим свойства второго объекта, которых нет в первом объекте
      for (const prop in obj2) {
        if (obj2.hasOwnProperty(prop) && !obj1.hasOwnProperty(prop)) {
          // Добавляем новое свойство
          patch.push({op: "add", path: `/${prop}`, value: obj2[prop], oldVal: undefined});
        }
      }
    
      return patch;
    }


    Каждая операция jsonpatch теперь содержит поле `oldVal`, которое хранит старое значение свойства, которое было изменено. Если свойство было удалено или добавлено, то `oldVal` будет иметь значение `undefined`.

    Пример использования:

    const obj1 = {a: {b: "hello"}, c: [1, 2, 3]};
    const obj2 = {a: {b: "world", d: "foo"}, c: [1, 2, 4, 5], e: "bar"};
    
    const patch = generateJsonPatch(obj1, obj2);
    
    console.log(patch);
    // Output:
    // [
    //   {"op":"replace","path":"/a/b","value":"world","oldVal":"hello"},
    //   {"op":"add","path":"/a/d","value":"foo","oldVal":undefined},
    //   {"op":"remove","path":"/c/2","oldVal":3},
    //   {"op":"add","path":"/c/3","value":5,"oldVal":undefined},
    //   {"op":"add","path":"/e","value":"bar","oldVal":undefined}
    // ]


    Обратите внимание, что поле oldVal в jsonpatch содержит информацию только о тех свойствах, которые были изменены или удалены. Если свойство не было изменено, то его oldVal будет иметь значение undefined.



    PS: сам удивился, на сколько он хорош в подобных задачах. Можно было бы написать и самому, точно также рекурсивно обойдя объекты, но эта шняга сэкономила достаточно много времени.
    Ответ написан
    3 комментария
  • Как безопасно обновить пакеты?

    CityCat4
    @CityCat4
    Внимание! Изменился адрес почты!
    В системе запущен apt-get, который заблокировал нужные файлы. Здесь есть два пути:

    1. sudo kill -9 35487
    2. Найти, где и зачем запущен apt-get и выключить его. Неестественно умная бубунта может запускать apt-get для обновления кэша пакетов например. Чтобы выдать сообщение "Подруга, тут стопицот пакетов обновилось, будем ставить?"
    Ответ написан
    3 комментария
  • Как запушить изменения на Bitbucket?

    Alex_Geer
    @Alex_Geer
    System Engineer
    Ошибка "Permission denied (publickey)" говорит о том, что ssh-ключ не был распознан. Попробуйте выполнить следующие действия:

    1. Проверьте, что вы используете правильный ssh-ключ, который был добавлен в ваш аккаунт на Bitbucket.
    2. Убедитесь, что вы используете правильное имя пользователя для git. Это может быть не ваше имя пользователя на Bitbucket.
    3. Проверьте, что ваш ssh-ключ находится в правильном месте на вашем компьютере. Он должен быть в папке .ssh в вашей домашней директории.
    4. Убедитесь, что вы имеете права на запись в репозиторий. Это может быть необходимо, если вы создали репозиторий от имени другого пользователя.
    5. Если проблема не решена, попробуйте использовать https-ссылку вместо ssh для доступа к репозиторию. Вы можете найти эту ссылку на странице вашего репозитория на Bitbucket.
    Ответ написан
    5 комментариев
  • Как вставить пробел после каждого 3 символа с конца, при вводе в инпут?

    function format(str) {
        const s = str.length;
        const chars = str.split('');
        const strWithSpaces = chars.reduceRight((acc, char, i) => {
            const spaceOrNothing = ((((s - i) % 3) === 0) ? ' ' : '');
            return (spaceOrNothing + char + acc);
        }, '');
    
        return ((strWithSpaces[0] === ' ') ? strWithSpaces.slice(1) : strWithSpaces);
    }
    Ответ написан
    3 комментария
  • Как получить читаемое значение promise?

    Seasle
    @Seasle Куратор тега JavaScript
    - console.log(`userId: ${userId}`);
    + console.log('userId:', userId);

    а там уже смотрите, что за объект Вам пришел.
    Ответ написан
    3 комментария
  • Как правильно прописать цикл?

    @ragq1991
    У Вас происходит переполнение памяти за счет зацикливания. Ваш цикл работает так: пока находится вхождение в строке list делай то-то и то-то, но строка list при этом не изменяется, и Ваш цикл пытается раотать вечно находя снова и снова первое вхождение. Вам необходимо внутри цикла прописывать заумену/удаление найденного вхождения в строке list что бы while искал следующее вхождение и в конце-концов вернул значение -1, то есть вхождений не найдено.
    Ответ написан
    1 комментарий
  • Как исправить Everything up-to-date?

    sergey-kuznetsov
    @sergey-kuznetsov Куратор тега Git
    Автоматизатор
    Команда git push origin master означает «отправить локальную ветку master в репозиторий origin». Если в ответ вам выдало сообщение, что нечего отправлять (Everything up-to-date), значит вы сейчас не находитесь в ветке master, а работаете в какой-то другой ветке, либо вообще вышли из всех веток (Detached HEAD). Поэтому команда git commit добавляет коммит не в master, а куда-то ещё, и соответственно отправлять из мастера нечего.

    В таких случаях только git status поможет узнать точную причину и подскажет решение.
    Ответ написан
    Комментировать
  • Почему запустив сервер Django с помощью Docker, он не работает?

    dimonchik2013
    @dimonchik2013
    non progredi est regredi
    CMD [ "python", "./manage.py", "runserver", "0.0.0.0:8000", "--settings=mysite.settings.prod" ]
    Ответ написан
    Комментировать
  • Как подключить библиотеку?

    vool
    @vool
    Разработчик
    Для того чтобы в Node.js использовать import перейдите в файл package.json и добавьте вот это:
    "type": "module"
    но тогда вы уже не сможете ымпортировать через require, только через import,

    и тогда ваш код(при "type": "module"):
    import chalk from 'chalk';

    Но если вы хотите через require и у вас странная ошибка
    require() of ES Module /node_modules/chalk/source/index.js from /src/index.js not supported.
    то мне помогло вот это:
    просто в том же package.json измените тип модуля на cjs, вот так:
    "type": "cjs"

    Тогда вы сможете импортировать либы через require
    Ответ написан
    Комментировать
  • Как добавить запись в бд при условии, что она не была до этого добавлена?

    @Akina
    Сетевой и системный админ, SQL-программист.
    Во-первых, надо создать в таблице уникальный индекс по полю, которое не должно содержать дубликатов.
    Во-вторых, надо использовать INSERT IGNORE INTO, чтобы дублирование одного значения не обваливало весь вставляемый массив. Либо REPLACE INTO, если при дублировании надо полностью заменить старую запись новой. Либо INSERT ODKU, если надо обновить старые данные новыми по некоей логике (например, вставить значения в поля, в которых раньше было NULL, а теперь пришло что-то определённое). Это - для MySQL, в других СУБД синтаксис с аналогичными возможностями будет иным.
    Ответ написан
  • Из-за чего может быть ошибка?

    sotvm
    @sotvm
    Умный поймёт, а дураку и так всё равно.
    поставь другое ядро чуть постарее/новее,
    а хедеры и ядро (5.4.0-56) удали
    проверь источники приложений (почему то у тебя не видит это ядро в репозиториях)
    Ответ написан
    1 комментарий
  • Как правилось указать тип значений?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Ошибка в том что файл у вас читается как js, а не как ts. Разберитесь с конфигами.
    Ответ написан
    Комментировать
  • Как получить значение после fetch-запроса?

    irtek
    @irtek
    Wordpress-addicted
    Если у вас идея обработчик ответа оставить внутри модуля, то в первом файле меняете на

    const fetch = require('node-fetch');
    
    module.exports = async () => {
      return fetch(URL, {
        method: 'POST',
        headers: {
          'Content-Type': 'application/xml'
        }
      })
        .then((res) => {
          return res
        })
    }

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

    А в результирующем файле просто выводите результат в then, ожидая результат выполнения асинхронной функции, которую получили:

    const postRequest = require('./postRequest');
    
    postRequest()
      .then(function (res) {
        console.log(res);
      })
    Ответ написан
    7 комментариев