|
23 / 22 / 11
Регистрация: 07.10.2013
Сообщений: 90
|
|||||||||||
Массив: Приложение по составлению списков товаров для дальнейшей работы с этим списком24.07.2019, 11:10. Показов 1560. Ответов 7
Метки нет (Все метки)
Всем добрый день.
Недавно начал изучать Vue.js. Фреймворк очень понравился. На данный момент создаю приложение по составлению списков товаров для дальнейшей работы с этим списком. Данные по списку у меня хранятся в this.items, который вначале представляет из себя пустой массив. Список создается динамически по за запросу штрихкода товара на API сервер, с этой частью я разобрался. API по запросу возвращается json объекта товара. этот объект я пушу новым элементом в this.items. Пример объекта товара:
![]() Если обратите внимание, на изображении вы можете увидеть, что строчки 1 и 2 идентичные. Дело в том, что мне нужно представлять список как в таком виде, так и в схлопнутом виде. В схлопнутом виде этот же список должен выглядетьт уже так: ![]() То есть происходит "distinct" по ШК, при этом суммируется кол-во товара. Надеюсь вы поняли. Для этого я создал поле this.isCollapsed, привязал к радио кнопке. В состоянии false должен отображаться шаблона как на первой картинке, при true, соответственно как на второй картинке. Сначала для схлопнутого списка я создал новое поле this.itemsColapsed. И заполнял его параллельно с полем this.items при запросе. Но, пришел к мнению, что это не совсем правильно. Особенно учитывая, что есть интересный метов computed, который можно формировать при изменении this.items. Вот тут то, соббсно, у меня и возникла проблемка, как формировать computed метод itemsCollapsed(). В методе он должен будет перебирать массив this.items, вытаскивать у него уникальные штрихкоды, на основе него формировать новый массив, а также нужно просуммировать все кол-ва каждого штрихкода. Короче у меня получилось так:
И мой опыт подсказывает, что это можно сделать проще. Есть ли варианты? Через reduce()? Может кто сталкивался с таким? Спасибо заранее за ответ.
0
|
|||||||||||
| 24.07.2019, 11:10 | |
|
Ответы с готовыми решениями:
7
Считать числа из файла в массив для дальнейшей работы с ними Как вернуть массив обьектов для дальнейшей работы с ним? |
|
431 / 302 / 90
Регистрация: 03.12.2015
Сообщений: 741
|
||||||
| 24.07.2019, 23:06 | ||||||
|
Отобрать уникальные элементы можно с помощью такого кода.
На больших списках будет тормозить, т.к. имеет сложность O(N^2).
1
|
||||||
|
23 / 22 / 11
Регистрация: 07.10.2013
Сообщений: 90
|
|
| 25.07.2019, 09:45 [ТС] | |
|
Спасибо за ответ. Вставил ваше решение, но на выходе получается массив из уникальных значений. Как насчет просуммировать кол-во уникальных значений. Ну для решения моей задачи со списком в схлопнутом виде.
0
|
|
|
431 / 302 / 90
Регистрация: 03.12.2015
Сообщений: 741
|
|||||||||||
| 25.07.2019, 11:06 | |||||||||||
|
Да, это чуть сложнее. В принципе, ты правильно все делал.
0
|
|||||||||||
|
23 / 22 / 11
Регистрация: 07.10.2013
Сообщений: 90
|
||||||
| 25.07.2019, 12:41 [ТС] | ||||||
|
Нашел решение:
Правда снова столкнулся с непонятной для меня проблемой. Почему то этот метод влияет на сами данные this.items. Можно видеть на картинках ниже, я пошагово добавляю по одному и тому же товару в this.data. В секции Not collapsed отображается не схлопнутые, в Colalpsed - схлопнутые Шаг 1, добавляем первый товар: ![]() Здесь все ок пока. Шаг 2, добавляю тот же товар еще раз: ![]() По идее должен был добавиться товар с кол-вом - 1, но почему то кол-во указано - 2, а в схлопнутом посчитано верно. Ну и Шаг 3, добавлю еще раз такой же товар: ![]() Как то так, кол-ва совсем неверные у несхлопнутого и схлопнутого. Дело в computed функции? Каким образом в нем изменяется this.data? Помогите плз!
0
|
||||||
|
431 / 302 / 90
Регистрация: 03.12.2015
Сообщений: 741
|
|||||||
| 25.07.2019, 13:08 | |||||||
Возможные решения: либо делать копию элемента при записи его acc (в (1)), либо не менять их (в (2)), т.е. хранить количество отдельно от элемента (как в моем коде выше).
1
|
|||||||
|
23 / 22 / 11
Регистрация: 07.10.2013
Сообщений: 90
|
||
| 25.07.2019, 13:39 [ТС] | ||
|
Дельный совет. А еще можно клонировать объект изначально и работать с клоном.
Думаю так и сделаю. Кстати, загуглил, как в Vue.js можно клонировать объекты... Вобщем я был в недоумении что предлагают на официальном форуме:
Так или иначе, спасибо большое за помощь. Тему можно закрыть.
0
|
||
|
431 / 302 / 90
Регистрация: 03.12.2015
Сообщений: 741
|
||
| 25.07.2019, 14:10 | ||
|
0
|
||
| 25.07.2019, 14:10 | |
|
Помогаю со студенческими работами здесь
8
Разработать программу работы со списком очередей списков Объявить класс, содержащий массив, индексатор для работы с этим массивом и приватный конструктор Объявить класс, содержащий одномерный целочисленный массив размерностью 10, индексатор для работы с этим массивом Искать еще темы с ответами Или воспользуйтесь поиском по форуму: |
|
Новые блоги и статьи
|
||||
|
PhpStorm 2025.3: WSL Terminal всегда стартует в ~
and_y87 14.12.2025
PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта
Симптом:
После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .
|
Access
VikBal 11.12.2025
Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
|
Новый ноутбук
volvo 07.12.2025
Всем привет.
По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне:
Ryzen 5 7533HS
64 Gb DDR5
1Tb NVMe
16" Full HD Display
Win11 Pro
|
Музыка, написанная Искусственным Интеллектом
volvo 04.12.2025
Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .
|
От async/await к виртуальным потокам в Python
IndentationError 23.11.2025
Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
|
|
Поиск "дружественных имён" СОМ портов
Argus19 22.11.2025
Поиск "дружественных имён" СОМ портов
На странице:
https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/
нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .
|
Сколько Государство потратило денег на меня, обеспечивая инсулином.
Programma_Boinc 20.11.2025
Сколько Государство потратило денег на меня, обеспечивая инсулином.
Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов.
. . .
|
Ломающие изменения в C#.NStar Alpha
Etyuhibosecyu 20.11.2025
Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .
|
Мысли в слух
kumehtar 18.11.2025
Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .
|
Создание Single Page Application на фреймах
krapotkin 16.11.2025
Статья исключительно для начинающих. Подходы оригинальностью не блещут.
В век Веб все очень привыкли к дизайну Single-Page-Application .
Быстренько разберем подход "на фреймах".
Мы делаем одну. . .
|