И еще один вопрос: можете разъяснить - в чем разница у select значения selected и value ?
Чем пользоваться надо, this.selected или this.value ?
Потому что у меня в коде сейчас через this.value = '999'; работает, а через this.selected = '999'; не работает.
Может наверное selected с index связан, а value с непосредственно значением?
В общем не совсем понятны зависимости....
Evgeny Kulakov:
давайте сформулирую, а вы pls поправьте если не так:
т.е. значение value, переданное в сам props будет передаваться всегда, но в сам select будет передаваться из props только один раз при создании select, а если в дальнейшем менять значение value, то в props будет передано новое значение value, а вот далее оно в сам select не передается? так?
и чтобы это значение из props передать далее в сам select, нужно через наблюдатель watch передать его вручную в select, так ?
У меня подозрение, что не биндятся данные.
Можете подсказать - data:{someState1.state1.value} - это будет реактивно?
Или только просто data:{state1} будет реактивно, а глубже уже нет?
И еще - при изменение данных data объекта с глубиной вложенности больше 1 будет работать v-bind ???
Андрей Хохлов:
Посмотрел пример - что то вроде того у меня, если брать ансинхронную загрузку данных. Еще информация к размышлению - у меня форма со множеством контролов-select, и те из них, которые сразу при создании компонента-родителя имеют все исходные данные (и options и selected value) , которые при создании передаются в компонент-потомок, вот эти контролы нормально показывают и все options и изначально установленное значение selected. А вот те, в которые потом данные (options и selected value) подгружаю асинхронно и меняю изначально установленные при создании данные на загруженные, то:
1. options у selecta есть - т.е. вручную могу выбрать новые значения.
2. selected value в data компонента-родителя присвоено новое значение, в консоль вывожу полный объект data - показывает что свойство data, передающее в компонент-потомок значение для selected изменено на новое.
3. т.е. получается, что новые данные в data компонента-родителя есть, но передается почему то только значения options, а для selected не передается.
Вопрос - почему? Что я делаю не так?
При начальной загрузке все показывает, но, допустим, я подгружаю асинхронно данные и меняю someState2.state2 = {....новые данные......}, то не биндятся они почему то. Пробовал и через $set, и через Object.assign - никак..
Хотя в DOM они есть - в браузере видно.
Меняю значение someState1.state1.value = 999, то же самое - в консоль выводит что значение новое присвоено, но select не отображает почему то... (компонент - это select)
Вот и не пойму - данные новые есть, но select не ставится в новую позицию selected
UPD
Вот еще по теме потребления памяти браузером.
Т.к. я выше упомянул, что работаю с изображениями, то в поисках оптимизации различных параметров, в т.ч. и расхода памяти наткнулся на давно мной прочитанную и уже позабытую статью, где как раз и упоминается про особенности потребления памяти при работе с изображениями в JavaScript Ресайз картинок в браузере. Все очень плохо
Этот момент обязательно нужно учитывать, тем более в SPA и подобных направлениях.
dimonchik2013:
Ну, кстати, да ;)
После всех проверок выяснил, что проблема была в неосвобожденных переменных - ну, и, соответственно, висячие данные накапливались и память кушалась.
Сейчас все почистил, обнулил - теперь держит +- 15Мб.
Да еще с роутером косячок нашел - тоже объем с сервера грузился не туда куда надо...
В общем - внимательнее надо быть :)
В приложении обработка изображений в канвас. Но при загрузке картинки 500 кб расход памяти прыгает +100мб. Вот и что то сомневаюсь, что это нормально..
Это и есть весь код.
Ну плюс div с id и подключение vue.js
Проверял в хроме и мозилле профилированием.
Причем потребление памяти в готовом приложении растет в пределах +(10Мб-50Мб) за нажатие F5, а голый объект около 5-7 Мб за одно обновление страницы. Вероятно зависит от количества данных и компонентов.
И сборщик мусора почти не сбрасывает размер, совсем немного, а потом если на вкладке не делать ничего стоит на месте одна цифра.
изменение значения я делал через v-on:change=""