Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.10.2021, 20:51
Аватар для fxobject
Кандидат Javascript-наук
Отправить личное сообщение для fxobject Посмотреть профиль Найти все сообщения от fxobject
 
Регистрация: 01.03.2021
Сообщений: 133

Vue отрисовка массива
в массиве находятся объкты, свойства которого являются колонками таблицы. Каждый элемент объекта строка, свойства - колонки.
разметка сделана вот так:
<div>
<div>заголовок колонки 1</div>
<div disabled v-for="HostRead in device.snmpHostRead.value">{{HostRead.ip}}</div>
</div>

<div>
<div>заголовок колонки 2</div>
<div disabled v-for="HostRead in device.snmpHostRead.value">{{HostRead.community}}</div>
</div>
ну и т.д.
что то меня терзают смутные сомнения, что цикл вывода отрабатывает столько количество раз, сколько колонк.
Нехорошо. И по разметке не объединить в один никак не получается.
Есть ли какая нибудь хитрость в vue чтобы решить этот вопрос одним циклом (кроме как менять разметку)?
Спасибки
Ответить с цитированием
  #2 (permalink)  
Старый 03.10.2021, 20:56
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,480

Очевидно.
<template v-for="HostRead in device.snmpHostRead.value">
<div>
<div>заголовок колонки 1</div>
<div disabled>{{HostRead.ip}}</div>
</div>

<div>
<div>заголовок колонки 2</div>
<div>{{HostRead.community}}</div>
</div> 
</template>
__________________
29375, 35
Ответить с цитированием
  #3 (permalink)  
Старый 04.10.2021, 06:25
Аватар для fxobject
Кандидат Javascript-наук
Отправить личное сообщение для fxobject Посмотреть профиль Найти все сообщения от fxobject
 
Регистрация: 01.03.2021
Сообщений: 133

неочевидно и неправильно. вариант только менять разметку. спасибо
Ответить с цитированием
  #4 (permalink)  
Старый 04.10.2021, 18:33
Аватар для fxobject
Кандидат Javascript-наук
Отправить личное сообщение для fxobject Посмотреть профиль Найти все сообщения от fxobject
 
Регистрация: 01.03.2021
Сообщений: 133

Еще есть один вопрос, у меня получается информационная структура очень сложная, причем вариативная (т.е. определенные поля присутствуют всегда, другие могут появляться или исчезать).
Но самое главное - не все поля участвуют в отрисовке на странице.
Насколько правильно (концептуально) хранить всю структуру в vue?
Ну не дублировать же данные для него создавая только отображаемые свойства?
Т.е. получив полный пакет с данными нужно ли
1 сохранить их в классе и для vue передать только те, которые он использует для отображения. (фигня полная)
2 весь объект с данными передается vue. тут сомнения........
кстати можно сделать как то чтобы на определенные данные vue не ставил свой сеттер, геттер?
Спасибо всем кто откликнется
Ответить с цитированием
  #5 (permalink)  
Старый 04.10.2021, 18:41
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,480

Если данные не должны быть реактивными - т.е. вида положил и забыл, то чтоб не плодить оверхеда на реактивность почём зря есть два способа сказать vue не трогать объект:
1. Официальный - Object.freeze(). Микроскопический оверхед на собственно заморозку.
2. Недокументированный - свойство _isVue: true. Проще и нет оверхеда, но на свой страх и риск.
__________________
29375, 35

Последний раз редактировалось Aetae, 04.10.2021 в 18:43.
Ответить с цитированием
  #6 (permalink)  
Старый 04.10.2021, 18:49
Аватар для fxobject
Кандидат Javascript-наук
Отправить личное сообщение для fxobject Посмотреть профиль Найти все сообщения от fxobject
 
Регистрация: 01.03.2021
Сообщений: 133

Я это посмотрю, но все очень важный вопрос - где же хранить данные.
Имеем некий сложный объект. Ему соответствуте некоторое количество "страниц" отрисовок. (страниц в смысле закладки). Причем не все данные объекта участвуют в отрисовке. Поля объекта могут менятся по поступающим запросам websokect и отрисовка vue как нельзя кстати.
данные также участвуют в расчетных алгоритмах которые не визуализируются.... ну и так далее. vue - это был прогресс уйти от разметки кода в скрипте js.
Но где же хранить полноценный объект не могу сообразить!
есть совет?
Ответить с цитированием
  #7 (permalink)  
Старый 04.10.2021, 18:55
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,480

Где удобнее там и храните. Если вам нужна реактивность, не обязательно хранить данные для этого прям в компоненте. Можно сделать отдельно реактивный объект и использовать его где-то у себя в коде, импортируя его в нужный компонент и используя в computed если нужна часть и в data если весь. В vue 2 для этого есть observable(), в vue 3 - reactive().

Оверхед на реактивность "лишних" свойств обычно пренебрежимо мал. Тут уж самому смотреть надо что выгодней в конкретном случае: реактивить лишнее или убирать руками.
__________________
29375, 35

Последний раз редактировалось Aetae, 04.10.2021 в 18:58.
Ответить с цитированием
  #8 (permalink)  
Старый 04.10.2021, 19:20
Аватар для fxobject
Кандидат Javascript-наук
Отправить личное сообщение для fxobject Посмотреть профиль Найти все сообщения от fxobject
 
Регистрация: 01.03.2021
Сообщений: 133

В общем суть понятна. Спорить не буду. Немного неправильно я выставил акценты по отношению к vue. Если у него уровень абстракции - отрисовка данных, ну значит не нужно ничего больше требовать. нужно просто создать удобный механизм обновляющий его сеттеры при изменении данных, ну и структура только для DOM элементов.
Ладно, спасибо. Пошел думать
Ответить с цитированием
  #9 (permalink)  
Старый 04.10.2021, 19:25
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,480

fxobject, Vue - отрисовка + реактивность, не стоит забывать про реактивность, она самая лучшая и удобная из тех что видел.)

А структура кода, архитектура и паттерны - это да, не к Vue.
__________________
29375, 35
Ответить с цитированием
  #10 (permalink)  
Старый 04.10.2021, 19:29
Аватар для fxobject
Кандидат Javascript-наук
Отправить личное сообщение для fxobject Посмотреть профиль Найти все сообщения от fxobject
 
Регистрация: 01.03.2021
Сообщений: 133

Это да. Насколько у меня негатив по отношению в фрейморкам. Вот второй день разбираюсь - кайфую )))
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Локальное подключение компонентов vue? Lodas Библиотеки/Тулкиты/Фреймворки 0 11.04.2020 22:42
Помогите , элементы массива по порядку из другого массива Rost_shat Javascript под браузер 9 28.07.2018 20:03
Обход многомерного массива с задержкой после каждого цикла Walk Общие вопросы Javascript 2 14.08.2017 16:17
Помогите к js коду, написать html код Modrih Элементы интерфейса 8 16.06.2015 18:08
Ввод диапазона значений массива с клавиатуры Воскобоенко Общие вопросы Javascript 11 06.06.2015 22:34