axios лучше

на все есть axios

Всем привет. ▫️Рубист-бэкендер. Делал пару проектиков с написанным на коленке фронтом на первом angular (если об опыте во фронте). ▫️Вопросы интеграции с rails/rack/jsonapi и бэкендом вообще ▫️Подтягиваю знания по js, делая фронт для своего проектика ▫️Петербург ▫️Узнал из awesome-vue

приветствую

помогите разобраться. в некоторых сборках вью главный компонент подключается так render: h => h(App), а в некоторых так components: { App }. в чем разница?

О, новая версия вышла https://github.com/vuejs/vue/releases/tag/v2.5.3

помогите разобраться. в некоторых сборках вью главный компонент подключается так render: h => h(App), а в некоторых так components: { App }. в чем разница?

В одном случае отдаём компонент рендерится уже. В другом объявляем компоненты которые будут встречаться в шаблоне

В одном случае отдаём компонент рендерится уже. В другом объявляем компоненты которые будут встречаться в шаблоне

а почему не всегда работает components: { App }

Что значит не всегда работает

?

просто я настраиваю свою сборку и когда подключаю через components, то компилятор ругается

И на что же он ругается

а через рендер норм

И на что же он ругается

вернее просто не монтирует

Не монтирует — значит не используется зарегистрированный компонент в шаблоне

А если рендер, то вью шаблон и не ищет — просто использует переданный компонент

Не монтирует — значит не используется зарегистрированный компонент в шаблоне

похоже импорт не делает ?! ...

Не монтирует — значит не используется зарегистрированный компонент в шаблоне

точно! спасибо) а то сижу туплю уже час

Всем привет! У меня проект на nuxt такая проблема, когда обновляешь страницу не работают плагины, а если приходишь на эту страницу с другой страницы плагины работают, в чем проблема куда копать?

На месте плагинов нечего нет и сообщений о ошибке тоже нету

Импорт плагинов которые должны быть только на клиенте надо оборачивать в if process.browser

Господа, может кто объяснит где я не прав и чего не понимаю. есть следующее: код - http://paste.org.ru/?ioeru6 разметка - http://paste.org.ru/?q6qdjo 3 компонента. через this.$emit вызываю событие. но толку 0.

событие должно дойти до приложения item->list->app

Использую vue-webpack, как мне из компонента получить path на папку assets?

Использую vue-webpack, как мне из компонента получить path на папку assets?

Ну смотря где у тебя компонент лежит

Ну смотря где у тебя компонент лежит

А можно как то использовать глобальный path, чтоб не зависеть от расположения компанента?

А можно как то использовать глобальный path, чтоб не зависеть от расположения компанента?

А, тогда не смогу помочь. Я не профессионал в этом

А можно как то использовать глобальный path, чтоб не зависеть от расположения компанента?

'@/assets'?

'@/assets'?

Что значит здесь знак "@"?

На корень указывает, это алиас

Что значит здесь знак "@"?

^

На корень указывает, это алиас

Можно свои алиасы напилить в webpack.base.config.js

Можно свои алиасы напилить в webpack.base.config.js

Можно, а зачем ты мне это сказал?)

'@/assets'?

Что то не совсем работает, как правильно? <template> <swiper :options="swiperOption"> <swiper-slide> <div class="slide-text" v-bind:style="backgroundImg()"> </div> </swiper-slide> </swiper> </template> <script> import { swiper, swiperSlide } from 'vue-awesome-swiper' require('swiper/dist/css/swiper.css') export default { components: { swiper, swiperSlide }, methods: { backgroundImg: function () { return { backgroundImage: 'url(@/assets/logo.png)' } } }, data () { return { swiperOption: { pagination: '.swiper-pagination', paginationClickable: true } } } } </script>

Error http://localhost:8081/@/assets/logo.png 404 (Not Found)

Что то не совсем работает, как правильно? <template> <swiper :options="swiperOption"> <swiper-slide> <div class="slide-text" v-bind:style="backgroundImg()"> </div> </swiper-slide> </swiper> </template> <script> import { swiper, swiperSlide } from 'vue-awesome-swiper' require('swiper/dist/css/swiper.css') export default { components: { swiper, swiperSlide }, methods: { backgroundImg: function () { return { backgroundImage: 'url(@/assets/logo.png)' } } }, data () { return { swiperOption: { pagination: '.swiper-pagination', paginationClickable: true } } } } </script>

оформляйте куски кода не тут

оформляйте куски кода не тут

Понял. https://jsfiddle.net/dLvcnyL2/

всегда писал в phpstorm, но для js он чтото тяжеловат. Кто подскажет, что выбрать для js и vue? кандидаты atom,brackets,vs code

Vs code очевидно же

может у какого то из них есть норм плагин для дебага и автокомплита

почему?

Потому что это мое субъективное мнение. Ну и там хватает плагинов для вью, опять же линтер и приттиер есть

спасибо

Пишу на вебшторме. Мне норм.

Но вс код тоже очень и очень неплох, да.

для серьезного написания и я буду phpstorm юзать. а быстро чтото поправить нужен блокнои

Потому что это мое субъективное мнение. Ну и там хватает плагинов для вью, опять же линтер и приттиер есть

может тогда и набором плагинов поделишься?

Понял. https://jsfiddle.net/dLvcnyL2/

Я не с компа так попробую объяснить Сначала нужно импортнуть картинку как модуль, потом переменную вставлять в css

Понял. https://jsfiddle.net/dLvcnyL2/

Посмотри стартовый пример у vue-webpack Там того так сделано

спасибо

Посмотри стартовый пример у vue-webpack Там того так сделано

Тогда картинка вставляется не как ссылка, а целиком код картинки вставляется в style

Тогда картинка вставляется не как ссылка, а целиком код картинки вставляется в style

А это плохо?

А это плохо?

Честно, не знаю) По производительности не ударит?

Error http://localhost:8081/@/assets/logo.png 404 (Not Found)

@ убери

И зачем тут тебе вообще метод нужен?

@ убери

Без @ тоже ошибка http://localhost:8081/assets/logo.png 404 (Not Found

Честно, не знаю) По производительности не ударит?

Лого же в любом случае пользователь грузить будет? Не ударит

Лого же в любом случае пользователь грузить будет? Не ударит

logo в данном случае как пример, на самом деле это для сладера с картинками w:1920

logo в данном случае как пример, на самом деле это для сладера с картинками w:1920

Тогда картинки в папку static и подключать оттуда как обычно

logo в данном случае как пример, на самом деле это для сладера с картинками w:1920

Пути посмотри как выбпак их положит в dist

https://marketplace.visualstudio.com/items?itemName=EditorConfig.EditorConfig

Тогда картинки в папку static и подключать оттуда как обычно

Спасибо

ERROR: S client not available

а паг с вуе может в директивы которые элемент?

Господа, может кто объяснит где я не прав и чего не понимаю. есть следующее: код - http://paste.org.ru/?ioeru6 разметка - http://paste.org.ru/?q6qdjo 3 компонента. через this.$emit вызываю событие. но толку 0.

this.$root.emit не так разве вызывается событие?

судя по докам нет

событие должно дойти до приложения item->list->app

в вью не работает вспылытие собитий более чем на 1 уровень

ну так можно по цепочке вызывать события и все

разве не так?

а со свой проблемой разобрался. именование событий либо одним словом либо как select-note

ну и потом this.$emit('select-note')

ну так можно по цепочке вызывать события и все

по цепочке, это всмысле перехватывать и тут же эмитить событие?

именно

может как то лучше можно. но пока не знаю

возможно, только вот так: https://ru.vuejs.org/v2/api/#vm-listeners

ан нет

ан нет

Данные по цепочке в парент компонент?

???

Если тебе надо передавать данные более, чем на один уровень вверх и ты не используешь вьюкс, то ты явно что-то делаешь не так

Парни, а кто-нибудь делал breadcrumbs?

Парни, а кто-нибудь делал breadcrumbs?

Нет, но у vuetify уже есть готовое

Если тебе надо передавать данные более, чем на один уровень вверх и ты не используешь вьюкс, то ты явно что-то делаешь не так

Ну не знаю, по мне, так всплытие ивентом могли бы сделать

Ну не знаю, по мне, так всплытие ивентом могли бы сделать

Если тебе это надо, то ты где-то накосячил в архитектуре

Если тебе это надо, то ты где-то накосячил в архитектуре

Не понимаю

Приведи пример, где это необходимо

Приведи пример, где это необходимо

Я тебе напишу, когда попадется кейс

Я тебе напишу, когда попадется кейс

Не забудь 8)

Канеш ?

Просто, если тебе мало одного уровня общения между компонентами, то надо юзать вьюкс и не еть мозги себе и коллективу

Просто, если тебе мало одного уровня общения между компонентами, то надо юзать вьюкс и не еть мозги себе и коллективу

При прокидывать пропсов я полностью согласен с тобой

А чем евенты хуже пропсов?

Потому что пропсы это в первую очередь данные, а эвенты - событие

а в скорости работы есть разница?