Простите, на совещание утащили. За ответы спасибо.

я имею ввиду что данные приложения лучше выносить в сторе

Что такое "данные приложения"?

Скажите, в чем приципиальная разница между миксинами, и если использовать extends

Скажите, в чем приципиальная разница между миксинами, и если использовать extends

Почти ни в чём, просто миксинов ты можешь добавить несколько, а наследовать компонент - только один

Я использую extends, когда мне надо расширить функционал какого-то компонента(который писал не я)

Товарищи. Как вы работаете с коллекциями? Есть какие то практики?

А mixin только для подмешивания некоторых общих методов/полей/пропсов, во избежание одинакового кода в нескольких компонентах

как можно скомпилировать файл со всеми его зависимостями в один файл

как можно скомпилировать файл со всеми его зависимостями в один файл

Построив дерево зависимостей

Построив дерево зависимостей

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

Под капотом строит

Там обход идёт все равно

Под капотом на этапе сборки js ?

Что бы решить вопрос дедубликации

Так каждый файл он просто оборачивает в анонимную функцию, заменяет импорты на вызов своей функции, и все. Дубликатов быть же не может

Идея то такая же как в require js

Так каждый файл он просто оборачивает в анонимную функцию, заменяет импорты на вызов своей функции, и все. Дубликатов быть же не может

Это ты глядя на результат работы делаешь вывод )?

Это ты глядя на результат работы делаешь вывод )?

Да, под капотом не разбирался, как он фаршит js

Да, под капотом не разбирался, как он фаршит js

Заебись делать выводы глядя на результат

Продолжай в том же духе ;)

Посоветуйте как быть? В реакте jquery - это как бы фу, не круто, хотя положа руку на сердце многие ui компоненты в либах таки используют jquery. В vue вроде более демократичны в этом отношении. Но в итоге я хз как лучше поступить, к примеру нужно мне табы реализовать, брать готовый компонент с бутстрапа например - где под капотом jquery. А дальше если мне нужно, пытаться как то vue логику сбоку припилить частично, чтобы за состоянием следить. Либо же это плохая идея вообще юзать ui компоненты бутстрапа и лучше взять какой то фреймверк типа bootstrap-vue или Vuetify и разбираться с их кривым апи?

А mixin только для подмешивания некоторых общих методов/полей/пропсов, во избежание одинакового кода в нескольких компонентах

Если честно, не уловил разницу(

Если честно, не уловил разницу(

Функционально разницы нет

extends: SomeComponent === mixins: [SomeComponent]

extends: SomeComponent === mixins: [SomeComponent]

окей, спасибо) просто зачем тогда они нужны)

Функционально разницы нет

Одно работает с прототипом, декоратор же работает с конструктором

Вроде так

Если ты наследуется то идёт prototype chain

Миксины в зависимости от реализации обычно уже экстендят экземпляр

Я смотрел исходники, там логика абсолютно одинаковая

Что бы решить вопрос дедубликации

А ты в это в коде нашел? Как может дубликация произойти?

https://github.com/vuejs/vue/issues/7412

Я смотрел исходники, там логика абсолютно одинаковая

Я в общем смысле

Без конкретики

https://github.com/vuejs/vue/blob/52719ccab8fccffbdf497b96d3731dc86f04c1ce/src/core/util/options.js#L381

Еще вопрос, как поступить. Нужно, чтобы при разном знаении пропса у формы ,импортился разный компонент с инпутом. Можно ли так сделать?

окей, спасибо) просто зачем тогда они нужны)

Короче, я юзаю миксины, когда надо подмешать одинаковый функционал в разные компоненты, при этом сам миксин не является компонентом и не может быть использован в шаблоне. А extend юзаю в том случае, если надо расширить функционал уже существующего компонента, т.е. то, что указывается в extends является готовым к использованию компонентом

Короче, я юзаю миксины, когда надо подмешать одинаковый функционал в разные компоненты, при этом сам миксин не является компонентом и не может быть использован в шаблоне. А extend юзаю в том случае, если надо расширить функционал уже существующего компонента, т.е. то, что указывается в extends является готовым к использованию компонентом

Спасибо за разъяснения)

Еще вопрос, как поступить. Нужно, чтобы при разном знаении пропса у формы ,импортился разный компонент с инпутом. Можно ли так сделать?

Юзай <component :is="componentName" /> где componentName это computed import ComponentOne from './path/to/componentOne'; import ComponentTwo from './path/to/componentTwo'; export default { components: { ComponentOne, ComponentTwo }, props: { someProp: { type: String, // Может иметь значения 'one' и 'two' } }, computed: { componentName() { const obj = { one: 'ComponentOne', two: 'ComponentTwo', }; return obj[this.someProp]; }, }, }; </script>

ретурн забыл

ретурн забыл

Случайно отправил раньше чем дописал

ежжи ☝

Юзай <component :is="componentName" /> где componentName это computed import ComponentOne from './path/to/componentOne'; import ComponentTwo from './path/to/componentTwo'; export default { components: { ComponentOne, ComponentTwo }, props: { someProp: { type: String, // Может иметь значения 'one' и 'two' } }, computed: { componentName() { const obj = { one: 'ComponentOne', two: 'ComponentTwo', }; return obj[this.someProp]; }, }, }; </script>

Да, спасибо) знаю, что так можно. Я имею ввиду, можно ли как не загружать совсем лишний компонент. То есть иметь один компонент, то испортом брать разный

Вопрос а нашо

Ну если тебе так сильно надо можешь попробовать вот так: const ComponentOne = () => import('/path/to/componentOne');

(но я не уверен, что будет работать, надо проверить)

А логика смены компонентов такая же как выше

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

Посоветуйте как быть? В реакте jquery - это как бы фу, не круто, хотя положа руку на сердце многие ui компоненты в либах таки используют jquery. В vue вроде более демократичны в этом отношении. Но в итоге я хз как лучше поступить, к примеру нужно мне табы реализовать, брать готовый компонент с бутстрапа например - где под капотом jquery. А дальше если мне нужно, пытаться как то vue логику сбоку припилить частично, чтобы за состоянием следить. Либо же это плохая идея вообще юзать ui компоненты бутстрапа и лучше взять какой то фреймверк типа bootstrap-vue или Vuetify и разбираться с их кривым апи?

bootstrap-vue совершенно нормальный, почти один в один обычный бутстрап

Посоветуйте как быть? В реакте jquery - это как бы фу, не круто, хотя положа руку на сердце многие ui компоненты в либах таки используют jquery. В vue вроде более демократичны в этом отношении. Но в итоге я хз как лучше поступить, к примеру нужно мне табы реализовать, брать готовый компонент с бутстрапа например - где под капотом jquery. А дальше если мне нужно, пытаться как то vue логику сбоку припилить частично, чтобы за состоянием следить. Либо же это плохая идея вообще юзать ui компоненты бутстрапа и лучше взять какой то фреймверк типа bootstrap-vue или Vuetify и разбираться с их кривым апи?

табы на чистом вью есть, как и всё остальное

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

Есть форма, которую использовать на наскольких сайтах. А на них разные инпуты, вот ломаю голову, как это наиболее безболезненно сделать

И у всех 50 компонентов надо шарить стейт? Что-то слабо представляю что за приложение. Можно код посмотреть?

форма, большая форма, в несколько шагов, с кучей вложенных компонентов

как лучше сделать, у меня есть 2 дива, с одинаковыми классами, нужно одному с дивов, добавить клас, через функцию при или после загрузки страницы

как лучше сделать, у меня есть 2 дива, с одинаковыми классами, нужно одному с дивов, добавить клас, через функцию при или после загрузки страницы

beforeMount мб

как лучше сделать, у меня есть 2 дива, с одинаковыми классами, нужно одному с дивов, добавить клас, через функцию при или после загрузки страницы

а что мешает-то?

beforeMount мб

Я забыл, какая там последовательность вызова хендлеров

Я забыл, какая там последовательность вызова хендлеров

судя по его вопросу, ему чихать на неё.

не, я понимаю, что бывают ситуации когда хочется всё управление данными в одном месте держать

Расскажу ситуацию свою: у меня огромная форма состоит из примерно 50 компонентов разной вложенности, некоторые компоненты используются несколько раз, в разных контекстах. Так вот, форма создания хорошо работает, что-то через props прокидываю и вроде всё хорошо. Но вот как сделать форму редактирования? как данные уже ранее сохраненные в базе дотащить до компонентов? Вот отседа vuex и вырос

Есть форма, которую использовать на наскольких сайтах. А на них разные инпуты, вот ломаю голову, как это наиболее безболезненно сделать

Можно генератор сделать

Экспортить функцию, которая принимает компонент инпута и возвращает компонент формы с этим инпутом, но это извращение какое-то

и с vuex вроде всё отлично, но вот то что компонент, как-то, должен знать имя своего модуля в глобальном store.. Значит ли это, что с помощью чей-то матери и джентельменского соглашения, я называть модули компонентов при добавлении в глобальный store должен именовать, например storeComponentName?

Есть форма, которую использовать на наскольких сайтах. А на них разные инпуты, вот ломаю голову, как это наиболее безболезненно сделать

ифами.

Экспортить функцию, которая принимает компонент инпута и возвращает компонент формы с этим инпутом, но это извращение какое-то

Нет, это норм, но не самое хорошее решение)

ERROR: S client not available

Экспортить функцию, которая принимает компонент инпута и возвращает компонент формы с этим инпутом, но это извращение какое-то

блин, ну да, извращение, но тут такого много. Хочется уже нормальные spa делать))

ифами.

А как во вью с оптимизацией? если иметь много ифов и компонентов, которые не будут использоваться?

А как во вью с оптимизацией? если иметь много ифов и компонентов, которые не будут использоваться?

Они не будут в доме

Так что все хорошо

А как во вью с оптимизацией? если иметь много ифов и компонентов, которые не будут использоваться?

максимально круто с ней.

Hello, i use Vuex . In App.vue : let _this = this; _this.$Progress.start(); _this.$store.dispatch('getGenerale').then(function(){ _this.$Progress.finish(); }); in Form.vue i try to get this.$store.getters.generale with computed computed: { generale(){ return this.$store.getters.generale } } but when i type in Form.vue in created() , i see lenght 0, because Ajax has not yet responded. How can I do this?

Hello, i use Vuex . In App.vue : let _this = this; _this.$Progress.start(); _this.$store.dispatch('getGenerale').then(function(){ _this.$Progress.finish(); }); in Form.vue i try to get this.$store.getters.generale with computed computed: { generale(){ return this.$store.getters.generale } } but when i type in Form.vue in created() , i see lenght 0, because Ajax has not yet responded. How can I do this?

hi, format your code by ``` plz

it's quite hard to read

Hello, i use Vuex . In App.vue : let _this = this; _this.$Progress.start(); _this.$store.dispatch('getGenerale').then(function(){ _this.$Progress.finish(); }); in Form.vue i try to get this.$store.getters.generale with computed computed: { generale(){ return this.$store.getters.generale } } but when i type in Form.vue in created() , i see lenght 0, because Ajax has not yet responded. How can I do this?

plus u don't need to store "this" context - use arrow function instead

then(() => this.$Progress.finish())

You can render your Form component right after data is set by ajax response

use v-if directive in App.vue with Form.vue component

Form.vue is template of the route

what's the main problem with getting 0 in computed property?

you can't render something or getting error?

Vue.js — русскоговорящее сообщество ?

нам не сложно и на английском ответить

;)

ok

I'm sorry, it's hard to explain the problem, I have a complicated structure. Thank you, I find a solution

you're welcome

I'm sorry, it's hard to explain the problem, I have a complicated structure. Thank you, I find a solution

Programming is struggling with complexity. So, your goal is to feel vue and swim smooth))

I have resolved, i added a condition in the App.vue <router-view: key = "$ route.fullPath" v-if = "Object.keys (general) .length"> </ router-view>

I have resolved, i added a condition in the App.vue <router-view: key = "$ route.fullPath" v-if = "Object.keys (general) .length"> </ router-view>

95% isn't the best solution. I'd look above to the architecture.

plus u don't need to store "this" context - use arrow function instead

Thanks for the idea. I forgot about v-if

bootstrap-vue совершенно нормальный, почти один в один обычный бутстрап

спасибо как раз смотрю его.

табы на чистом вью есть, как и всё остальное

да но тогда придется стайлить самому, чтобы приводить сайт к какому то общему дизайну

95% isn't the best solution. I'd look above to the architecture.

What is the best solution?

What is the best solution?

Dig up to the parents of this <router-view /> and rethink a little.

Юзаю mdbootstrap. Пытаюсь сделать модалку как в документашке https://mdbootstrap.com/vue/advanced/modals/ Но в консоль выдаёт ошибку Uncaught ReferenceError: jQuery is not defined Кто-нибудь сталкивался с этой дичью?