Max
А во вью вообще можно вот так стили затаскивать в компонент?
ivan potapov
да
heavycharged
Подскажите, пожалуйста. По чуть-чуть вникаю во Vue. У меня есть объект в дата:
branch: {
city: {
name: "New York",
state: {
name: "New York",
}
}
,
т.е., Branch - отделение, City: город в котором находится отделение, а State - штат в котором находится город.
В форме вывожу так: <input v-model="branch.city.name"/>
Все отлично выводится, теперь я хочу отслеживать изменения этого поля, чтобы если юзер начал туда вводить, например, Houston, то у меня сработала функция, сходила по API, вытянула все города Houston и показала в выпадайке, юзер кликнул и нужная пара city/state положилась в свойство city объекта branch.
Затык вот в чем: как мне отслеживать изменение только этого поля? Можно ли это как-то сделать без создания дополнительных полей в объекте дата, а просто напрямую работать с branch.city, отслеживать и редактировать сразу данное свойство и объект внутри него?
heavycharged
watch?
допустим я делаю watch: { cityChange: function(old,new) {...}}, тогда мне нужно в инпут прописать v-model="cityChange", и тогда туда не будет подгружаться название города.
Алексей
Если я не ошибаюсь, можно вотчить вложенные свойства
watch: {
‘Branch.city.name’: (newval, oldval) {}
heavycharged
Если я не ошибаюсь, можно вотчить вложенные свойства
watch: {
‘Branch.city.name’: (newval, oldval) {}
О, работает, кажется то что нужно)) спасибо!
Evgeny
22.03.2018 - Пройдет первый московский Vue.js митап
https://www.meetup.com/vue-js-moscow/
Регистрируйтесь и следите за анонсами.
Anton
Всем добрый день, есть такой вопрос пытаюсь делать проверку на ключ в обекте, но при попытке написать такое:
data(){
return {
postAllImg: {},
}
},
mounted(){
this.postAllImg = 'images' in this.post.attachments
? this.post.attachments.images
: '';
},
Выдает ошибку при загрузке
Cannot use 'in' operator to search for 'images' in undefined
Я так понимаю что он просто не успевает отрендариться до момента вызова, только не могу понять куда ее надо писать что бы все проходило без ошибки created() так же выдает такую ошибку, куда копать уже не знаю
Evgeny
22.03.2018 - Пройдет первый московский Vue.js митап
https://www.meetup.com/vue-js-moscow/
Регистрируйтесь и следите за анонсами.
@DenisIzmaylov Денис, запинешь?
Denis
Налетай! Торопись! :)
Rafael 🌵
Уже!
Evgeny
Спасибо! :)
Denys
22.03.2018 - Пройдет первый московский Vue.js митап
https://www.meetup.com/vue-js-moscow/
Регистрируйтесь и следите за анонсами.
трансляцию/записи собираетесь делать?
Evgeny
Кстати. У нас один слот освободился. Есть желающие?
Андрей
Максим
Vasiliy
Ждем в Питере
Evgeny
Докладчик один не сможет выступить
Evgeny
Трансляция будет
Evgeny
100-150 человек легко поместим
даже больше наверное сможем
Pavel
а где список докладов можно чекнуть?
Владислав
Иду)
Nikich
@jeka_ru Да, где можно список докладов чекнуть?
Pavel
хотя не важно что за список, все равно иду) но интересно заранее посмотреть на что иду )
Nikich
Я прям даже готов прилететь к вам из Ростова.)
Evgeny
Чуть попозже анонс сделаем
Nikich
Могу только рассказать, как с помощью nuxt'a стрелять по ногам себе. :D
Вообще, у меня нет опыта докладчика как такового.))
Pavel
я только осознавал полезщность скорости прототипирования стартапа что бы не угасать пока пилишь какую-нб штуку
Evgeny
Могу только рассказать, как с помощью nuxt'a стрелять по ногам себе. :D
Вообще, у меня нет опыта докладчика как такового.))
Ну так отличная тема, у нас про nuxt никто не докладывается.
и делаем мы эти мероприятия от разработчиков, разработчикам
отличный способ потренироваться, этоже не полноценная конференция.
Pavel
а то я еще попутно на ангуляре втором писал, и чет обос*ался
Pavel
кстати, что бы начать выступать, надо начать выступать ))
Алексей
Всем добрый день, есть такой вопрос пытаюсь делать проверку на ключ в обекте, но при попытке написать такое:
data(){
return {
postAllImg: {},
}
},
mounted(){
this.postAllImg = 'images' in this.post.attachments
? this.post.attachments.images
: '';
},
Выдает ошибку при загрузке
Cannot use 'in' operator to search for 'images' in undefined
Я так понимаю что он просто не успевает отрендариться до момента вызова, только не могу понять куда ее надо писать что бы все проходило без ошибки created() так же выдает такую ошибку, куда копать уже не знаю
this.postImages = this.post.attachments ? this.post.attachment.images || ‘’ : ‘’
Rafael 🌵
Nikich
Ну так отличная тема, у нас про nuxt никто не докладывается.
и делаем мы эти мероприятия от разработчиков, разработчикам
отличный способ потренироваться, этоже не полноценная конференция.
Ну я если честно даже не знаю, чего могу рассказать такого, чего остальные не знают.) Очень сложно как-то выцедить свой уникальный опыт, которым можно было бы поделиться.
Anton
this.postImages = this.post.attachments ? this.post.attachment.images || ‘’ : ‘’
дело в том что у меня там может быть целых 3 разных ключа и в зависимости от него запускать нужный мне кейс, так что не поможет
Nikich
Но вообще я уже немного загорелся идеей о выступлении с докладом.)
Alex
Ну я если честно даже не знаю, чего могу рассказать такого, чего остальные не знают.) Очень сложно как-то выцедить свой уникальный опыт, которым можно было бы поделиться.
Рассказать эпичную историю про потерянный контекст)
Rafael 🌵
Но вообще я уже немного загорелся идеей о выступлении с докладом.)
у меня тоже есть тема, но хз, успею ли я подготовиться :С
Алексей
дело в том что у меня там может быть целых 3 разных ключа и в зависимости от него запускать нужный мне кейс, так что не поможет
Ну суть в том что сначала тебе надо проверить родительский объект на undefined, а потом его свойства на наличие
Anton
Ну суть в том что сначала тебе надо проверить родительский объект на undefined, а потом его свойства на наличие
он 100% не пустой будет и 100% не undefined или vue все равно? он одает вообще пирвичный вид до рендара ?
Evgeny
а темы когда будут известны то?
Гарантировано за две недели до мероприятия. Но возможно пораньше сделаем анонс.
Evgeny
Но вообще я уже немного загорелся идеей о выступлении с докладом.)
Давай давай, время еще есть подготовиться, но затягивать не стоит
Anton
https://ssense.github.io/vue-carousel/
Anton
https://ssense.github.io/vue-carousel/api/ если надо carousel для понтов тогда свой писать проще, если надо простой вариант со скоростю лучше врядле найдешь
Алексей
он 100% не пустой будет и 100% не undefined или vue все равно? он одает вообще пирвичный вид до рендара ?
Если он *будет*, то есть на этапе инициализации компонента его нет, то тогда можно использовать watch
Serge
Вот народ избалованный пошел...)
Pavel
а слик обернутыыый во вью смотрел?
Pavel
я правда хз, трубет он жиквери или нет
Pavel
https://github.com/staskjs/vue-slick
Pavel
есть есть swiper, я его для ангуляра использую, круто, на вью не нашел норм чет
Anton
требует
Pavel
тогда отстой (
Anton
там даже по первой строке все ясно $('.single-item').slick();
Pavel
да я не смотрел, ща прост в огне весь, поэтому кинул неглядя
Anton
NOTE: slick-carousel official package appears to use *jquery* as a dependency in package.json, despite it would be more appropriate to use it as a peer dependency to avoid possibility of using multiple versions of jquery. Be aware of that. When using webpack you can solve this problem with aliases.
xxtux
Внезапно jquery начинаешь шарахаться
Alena
дima
Лол, вот это событие
дima
В Кировограде, в Ж мира он уже был
дima
Я уже думал там хакатон или ещё что-то
Erik
к чему кроме DIV можно забиндить приложение на vue? хотелось бы чтоб оно не перебивало стили body
Интересный вопрос. Кто нибудь встречал решение?
Tair
к чему кроме DIV можно забиндить приложение на vue? хотелось бы чтоб оно не перебивало стили body
а как стили боди связаны с привязкой к диву?
Nikita
есть есть swiper, я его для ангуляра использую, круто, на вью не нашел норм чет
vue-awesome-swiper это обертка над свайпером
Erik
а как стили боди связаны с привязкой к диву?
К примеру, писать такое уродство body.main(:styles=({'main-overflowHidden' : isModalOpened})
Tair
К примеру, писать такое уродство body.main(:styles=({'main-overflowHidden' : isModalOpened})
это типа, если есть модалка -- не скролься? я просто не спец по ЦСС
Erik
это типа, если есть модалка -- не скролься? я просто не спец по ЦСС
Верно. Если модалка открыта, спрятать глобальный скролл
Tair
Верно. Если модалка открыта, спрятать глобальный скролл
а если привязаться к боди, то это уже не проблема, да? я почему то думал, что с таким же успехом можно этот стиль нацепить на дивку, которая прямой потомок боди
Tair
потому что сам боди же тоже потомок <html>
Erik
а если привязаться к боди, то это уже не проблема, да? я почему то думал, что с таким же успехом можно этот стиль нацепить на дивку, которая прямой потомок боди
Нет, так не получится. Пока отслеживаю через watch переменную isModalOpened и в методах прописываю что-то вроде document.querySelector('body').style.overflow = hidden;
heavycharged
Для Vue есть что-то вроде комментов как в Google Docs?
sadkos
Подскажите каким образом можно реализовать следующее:
- рендерю список, у каждой строки есть кнопка "удалить". При клике, в функцию передается id элемента.
- удаление происходит через запрос на api и после удаления список перерендерится.
- пока удаление не произошло - хочу сделать анимацию на кнопке "удалить" или строку сделать с серым фоном. В общем добавить css класс на удаляемый элемент списка
Интересует каким именно образом это лучше сделать. Я делал через v-if : у каждого элемента был параметр "toDelete" : false и вместе с запросом на удаление я менял параметр на true и "v-if" тогда добавлял класс "toDelete"
Но чувствую что можно сделать добавление класса к элементу списка - более проще. Как то получив ссылку на элемент списка и добавляя css клас к DOM а не храня дополнительный параметр рядом с обычными данными.