может как-то императивно можно указать компоненту не маунтится?

и почему он вообще маунтится я не понимаю

ну т.е. если я повешу условие на app-modal тогда маунтед ожидаемо не отрабатывает. я был уверен что он не будет отрабатывать и если это условие внутри самого компонента. а оказалось вот что. у меня ощущение из-за этого и не работают мои транзишены с порталом

только я нахожу это странным и нелогичным?

Есть песочница?

выше ж ссылка. ее не видно?)

ну вот что не так? получается компонент будет маунтится если я пропсом кидаю условие?

как я раньше не обращал на это внимание не понятно

Ну компонент маунтится, несмотря на то что внутри него все под условием. Логично же :)

Выносите условие наверх

Если это критично

Ребят подскажите про правильность моих действий я сейчас делаю адаптацию, и у меня в проетке на мобильных устройствах вместо сайдбара стоит мобильная навигация внизу. так вот, я хочу через v-if показывать или сайдбар или навигацию. с этим у меня проблем нет, я все сверстал и сделал. дело в том, что у меня есть 2 лейаута, 1 без сайдбара (для страницы логина) а другой с сайдбаром (для всех страниц сайта), так вот, в каждой странице сайта есть обертка этим лейаутом с сайдбаром, а в ней уже контент, ну такая, стандартная практика, чтобы в App.vue мозги не делать. дело в том, что я хочу все сделать максимально производительным, то есть по v-if, чтобы для телефонов не грузился код, который не нужен. вот код этого лейаута: <template> <div class="layout-default"> <AppSidebar v-if="showSidebar"/> <MobileNavigation v-else/> <main> <slot/> </main> </div> </template> <script> import AppSidebar from './AppSidebar' import MobileNavigation from './MobileNavigation' export default { name: 'LayoutDefault', components: { AppSidebar, MobileNavigation }, data () { return { showSidebar: true } }, created () { window.addEventListener('resize', () => { this.showSidebar = window.innerWidth > 991 }) } } </script> а вот почему я спрашиваю: я в хуке created повесил обработчик ресайза на window, и при ресайзе присваивается значение переменной showSidebar, чтобы v-if работал. но в этот лейаут обернуты все страницы, за исключением логина, и когда будет новый переход по странице, то получается будет вешаться новый обработчик на window?

Если это критично

если вынесу условие наверх, то перестает работать транзишен

Транзишен тоже вынести наверх

если вынесу условие наверх, то перестает работать транзишен

впрочем нет, работает. значит это 100% вина портала.

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

Ребят подскажите про правильность моих действий я сейчас делаю адаптацию, и у меня в проетке на мобильных устройствах вместо сайдбара стоит мобильная навигация внизу. так вот, я хочу через v-if показывать или сайдбар или навигацию. с этим у меня проблем нет, я все сверстал и сделал. дело в том, что у меня есть 2 лейаута, 1 без сайдбара (для страницы логина) а другой с сайдбаром (для всех страниц сайта), так вот, в каждой странице сайта есть обертка этим лейаутом с сайдбаром, а в ней уже контент, ну такая, стандартная практика, чтобы в App.vue мозги не делать. дело в том, что я хочу все сделать максимально производительным, то есть по v-if, чтобы для телефонов не грузился код, который не нужен. вот код этого лейаута: <template> <div class="layout-default"> <AppSidebar v-if="showSidebar"/> <MobileNavigation v-else/> <main> <slot/> </main> </div> </template> <script> import AppSidebar from './AppSidebar' import MobileNavigation from './MobileNavigation' export default { name: 'LayoutDefault', components: { AppSidebar, MobileNavigation }, data () { return { showSidebar: true } }, created () { window.addEventListener('resize', () => { this.showSidebar = window.innerWidth > 991 }) } } </script> а вот почему я спрашиваю: я в хуке created повесил обработчик ресайза на window, и при ресайзе присваивается значение переменной showSidebar, чтобы v-if работал. но в этот лейаут обернуты все страницы, за исключением логина, и когда будет новый переход по странице, то получается будет вешаться новый обработчик на window?

Компонент же останется

Есть у меня вот такой вот список треков с названием треков и контролами справа: https://slack-imgs.com/?c=1&url=https%3A%2F%2Fmonosnap.com%2Ffacebook%2Fgenerate_image_preview%3Fid%3DhRdYxCD0xIyHQBTbTWFzY9BondFEzX. По нажатию на каждую из этих кнопок (будь то кнопка плей, редактирование или удалить) мне нужно, чтобы остальные кнопки выключались, а текущая (на которую нажал) включалась. И также нужно, чтобы по нажатию на кнопку “редактировать” слева открывался инпут этой строки (он спрятам, не суть). Как правильно на Vue.js делать такое?)

Компонент же останется

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

Есть у меня вот такой вот список треков с названием треков и контролами справа: https://slack-imgs.com/?c=1&url=https%3A%2F%2Fmonosnap.com%2Ffacebook%2Fgenerate_image_preview%3Fid%3DhRdYxCD0xIyHQBTbTWFzY9BondFEzX. По нажатию на каждую из этих кнопок (будь то кнопка плей, редактирование или удалить) мне нужно, чтобы остальные кнопки выключались, а текущая (на которую нажал) включалась. И также нужно, чтобы по нажатию на кнопку “редактировать” слева открывался инпут этой строки (он спрятам, не суть). Как правильно на Vue.js делать такое?)

Через жс менять данные

то есть проходиться по ВСЕМ кнопкам и их выключать, а потом включать нужную?

с помощью простого жс

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

Внутри компонента шаблона есть router-view в который уже подставляются компоненты страниц. Компонент шаблона остаётся

то есть проходиться по ВСЕМ кнопкам и их выключать, а потом включать нужную?

Можете завести свойство кто сейчас играет, а остальные сравнивать совпадает ли их айди с тем что играет или нет

Внутри компонента шаблона есть router-view в который уже подставляются компоненты страниц. Компонент шаблона остаётся

я знаю, в него подставляется компонент да, но у меня этот компонент, которы подставляется, обернут как раз таки в этот лейаут, в которов вешается ресайз на window

Просто лишнюю вложенность добавляете?

Можете завести свойство кто сейчас играет, а остальные сравнивать совпадает ли их айди с тем что играет или нет

То есть, если не совпало, то выключаем кнопку (то есть, свойство) и присваиваем этому свойству новую кнопку?

То есть, если не совпало, то выключаем кнопку (то есть, свойство) и присваиваем этому свойству новую кнопку?

Ну либо храните свойство что там сейчас активно и меняете его. Либо в каждом объекте своё свойство и меняете все)

Выбирайте

А немного не понял про свойство, которое активно

selectedId куда сохранять например айди проигрываемого

И везде сравнивать с selectedId чтобы понимать

ну просто дело в том, что, во-первых, у кнопок нет айди, а во-вторых, там ещё и редактирование кнопка, и удалить трек, + этот инпут ещё(

столько создавать свойств

Просто лишнюю вложенность добавляете?

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

у кнопок этих есть классы, одниковые, так как бэм

выходит надо как минимум 4 свойства создавать на инпут и каждую кнопку

Не у кнопок. У строки

Ну работайте от данных) хотите меняйте в данных строк, тогда не удивляйтесь что другие тоже надо менять)

Просто лишнюю вложенность добавляете?

так есть что подсказать?

Ну в апп.вью и разруливайте один раз на все страницы нужен сайдбар или мобильная навигация

вообщем, ребята. просто пишу вам чтобы вы не повторяли ошибки таких дебилов как я (которые тратят 5 часов на поиск лисапеда), а не читают доку <portal-target :transition="{ name: 'fade'}" :transition-events="{ enter: onEnterCallBack }" /> и все, ска, работает

у портала есть свой апи для транзишенов)))

зачем многие css фреймворки называют классы с цветами danger, warning, и т.д.?

почему нельзя назвать yellow, red, и т.д.?

это для того, что кто-то решит danger переделать в зеленый?

ну ладно там info, primary и т.д.

мир фронтенда такой дивный

все через жопку

зачем многие css фреймворки называют классы с цветами danger, warning, и т.д.?

Потому что семантика отделена от цветов

Может быть не красный а малиновый

Не зелёный а салатовый

А в некоторых случаях совсем другие цвета

Не будешь же в кучу мешать info и красный

почему нельзя назвать yellow, red, и т.д.?

Зачем?

это логично, да, но проблема в том, что люди начинают выделять скидки is-dangerами, а наличие is-success, и семантика более не семантика.

хотя, это видимо уже проблемы отдельных уникумов, можно же сделать .sale color: $danger-color

Именно

хотя, это видимо уже проблемы отдельных уникумов, можно же сделать .sale color: $danger-color

Зришь в корень

Проблема не в инструментах

А прослойках до них ))

в vuetify надо добавить justify-end только в некоторых случаях, как это реализовать через if else ? чет не получается у меня

async getDefaultsTest({ commit, getters, dispatch }) { console.log("getDefaults") try { await Promise.all([ new Promise((resolve, reject) => { if (getters["settings/app_settings"]) { resolve() } else { console.log("need settings_get") return this.$axios .$get("settings_get") .then(result => { console.log("settings get ok") commit("settings/SET_APP_SETTINGS", result.appSettings) resolve() }) .catch(err => reject(err)) } }), new Promise((resolve, reject) => { if (getters["configure/servers"]) { resolve() } else { console.log("need servers_get") return this.$axios .$get("servers_get") .then(result => { console.log("servers get ok") commit("configure/SET_SERVERS", result.servers) resolve() }) .catch(err => reject(err)) } }) ]) console.log("promise all end") } catch (err) { const error_msg = err.response && err.response.data ? err.response.data : err throw new Error(Request error. ${error_msg}) } }

чекните плиз код. что не так?

ERROR: S client not available

Зачем try catch?

смысл паралельно два запросе к беку отослать и заполнить стор. но только если нужно

в vuetify надо добавить justify-end только в некоторых случаях, как это реализовать через if else ? чет не получается у меня

:justify-end="trueStatementOrfalseStatement" ?

Зачем try catch?

ловить error из promise all

А .catch тебе зачем тогда

И promise all тут тоже плохо

:justify-end="trueStatementOrfalseStatement" ?

сейчас попробуйю, спасибо)

1 промис реджектнится- все реджектнится

А .catch тебе зачем тогда

без catch внутри это не работало корректно

почему? а как?

Promise.all().catch

Так лови ошибки

Promise.all().catch

ок. вместо try catch

Само собой

Или пиши свою обертку на параллелизацию

а что еще исправить?

Или любую библиотеку для асинк флоу

Например async

Или любую библиотеку для асинк флоу

хочецца пока так разобраться стандартным promise all . что еще исправить?

И return ещё всего этого

Иначе функция ж не асинхронная

может каждый запрос все же вынести в отдельнвй action

И return ещё всего этого

вместо чего?

вместо чего?

Всего содержимого функции

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

Всего содержимого функции

вместо new promise

async getDefaultsTest({ commit, getters, dispatch }) { console.log("getDefaults") try { await Promise.all([ new Promise((resolve, reject) => { if (getters["settings/app_settings"]) { resolve() } else { console.log("need settings_get") return this.$axios .$get("settings_get") .then(result => { console.log("settings get ok") commit("settings/SET_APP_SETTINGS", result.appSettings) resolve() }) .catch(err => reject(err)) } }), new Promise((resolve, reject) => { if (getters["configure/servers"]) { resolve() } else { console.log("need servers_get") return this.$axios .$get("servers_get") .then(result => { console.log("servers get ok") commit("configure/SET_SERVERS", result.servers) resolve() }) .catch(err => reject(err)) } }) ]) console.log("promise all end") } catch (err) { const error_msg = err.response && err.response.data ? err.response.data : err throw new Error(Request error. ${error_msg}) } }

все не так

все не так

а как

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

так вроде уже так?

а как

запросы смешаны с логикой

аксиос в прототипе