и вот главный элемент

<div data-store="{'123':'123,'var':'foo'}" id="app"></div>

как мне установить дату в комоненте addForm

которая указана в data-store

?

Тут я окончательно сломался

это сообщество походу побратим шоу "Битва экстрасенсов")

уже сколько вопросов от разных людей. Причем без бутылки водки или обряда экзорцизма не разберешь

Ребт подскажет кто такой вот вопрос. Есть data from api и нужно если input cheked то одну дату ("price") выводить если нет то другую ("percent"). JSON { "changes": { "price": { "hour": 100.62, "day": 117.27, "week": 111.76, "month": -720.76, }, "percent": { "hour": 1.55, "day": 1.81, "week": 1.72, "month": -9.84, } } } HTML <label class="switch float-right" for="checkbox-bit"> <input type="checkbox" checked id="checkbox-bit" /> <div class="slider round"></div> </label> <li class="list-group-item bg-transparent border-0 p-0"> <p class="card-text m-0 float-left card-text--dark">Hour change</p> <p class="card-text m-0 float-right card-text--percent">${{api.changes.price.hour}}</p> </li> <li class="list-group-item bg-transparent border-0 p-0"> <p class="card-text m-0 float-left card-text--dark">Day change</p> <p class="card-text m-0 float-right card-text--percent">${{api.changes.price.day}}</p> </li> <li class="list-group-item bg-transparent border-0 p-0"> <p class="card-text m-0 float-left card-text--dark">Week change</p> <p class="card-text m-0 float-right card-text--percent">${{api.changes.price.week}}</p> </li> <li class="list-group-item bg-transparent border-0 p-0"> <p class="card-text m-0 float-left card-text--dark">Month change</p> <p class="card-text m-0 float-right card-text--percent">${{api.changes.price.month}}</p> </li> VUE <script> export default { name: 'api', data () { return { api: null } }, mounted() { this.axios.get('https://apiv2....').then(response => (this.api = response)) } } </script>

пацаны. тесты у vue-cli ругаются на переменные в sass файлах. сталкивался кто?

Что за тупизм?

https://ru.vuejs.org/v2/guide/forms.html

Ребт подскажет кто такой вот вопрос. Есть data from api и нужно если input cheked то одну дату ("price") выводить если нет то другую ("percent"). JSON { "changes": { "price": { "hour": 100.62, "day": 117.27, "week": 111.76, "month": -720.76, }, "percent": { "hour": 1.55, "day": 1.81, "week": 1.72, "month": -9.84, } } } HTML <label class="switch float-right" for="checkbox-bit"> <input type="checkbox" checked id="checkbox-bit" /> <div class="slider round"></div> </label> <li class="list-group-item bg-transparent border-0 p-0"> <p class="card-text m-0 float-left card-text--dark">Hour change</p> <p class="card-text m-0 float-right card-text--percent">${{api.changes.price.hour}}</p> </li> <li class="list-group-item bg-transparent border-0 p-0"> <p class="card-text m-0 float-left card-text--dark">Day change</p> <p class="card-text m-0 float-right card-text--percent">${{api.changes.price.day}}</p> </li> <li class="list-group-item bg-transparent border-0 p-0"> <p class="card-text m-0 float-left card-text--dark">Week change</p> <p class="card-text m-0 float-right card-text--percent">${{api.changes.price.week}}</p> </li> <li class="list-group-item bg-transparent border-0 p-0"> <p class="card-text m-0 float-left card-text--dark">Month change</p> <p class="card-text m-0 float-right card-text--percent">${{api.changes.price.month}}</p> </li> VUE <script> export default { name: 'api', data () { return { api: null } }, mounted() { this.axios.get('https://apiv2....').then(response => (this.api = response)) } } </script>

Условия отменили?

Ребт подскажет кто такой вот вопрос. Есть data from api и нужно если input cheked то одну дату ("price") выводить если нет то другую ("percent"). JSON { "changes": { "price": { "hour": 100.62, "day": 117.27, "week": 111.76, "month": -720.76, }, "percent": { "hour": 1.55, "day": 1.81, "week": 1.72, "month": -9.84, } } } HTML <label class="switch float-right" for="checkbox-bit"> <input type="checkbox" checked id="checkbox-bit" /> <div class="slider round"></div> </label> <li class="list-group-item bg-transparent border-0 p-0"> <p class="card-text m-0 float-left card-text--dark">Hour change</p> <p class="card-text m-0 float-right card-text--percent">${{api.changes.price.hour}}</p> </li> <li class="list-group-item bg-transparent border-0 p-0"> <p class="card-text m-0 float-left card-text--dark">Day change</p> <p class="card-text m-0 float-right card-text--percent">${{api.changes.price.day}}</p> </li> <li class="list-group-item bg-transparent border-0 p-0"> <p class="card-text m-0 float-left card-text--dark">Week change</p> <p class="card-text m-0 float-right card-text--percent">${{api.changes.price.week}}</p> </li> <li class="list-group-item bg-transparent border-0 p-0"> <p class="card-text m-0 float-left card-text--dark">Month change</p> <p class="card-text m-0 float-right card-text--percent">${{api.changes.price.month}}</p> </li> VUE <script> export default { name: 'api', data () { return { api: null } }, mounted() { this.axios.get('https://apiv2....').then(response => (this.api = response)) } } </script>

v-if https://ru.vuejs.org/v2/guide/conditional.html checkbox https://ru.vuejs.org/v2/guide/forms.html#%D0%A7%D0%B5%D0%BA%D0%B1%D0%BE%D0%BA%D1%81%D1%8B

eslint проверяет блок <style> в однофайловом компоненте и ругается на длину некоторых строк. Отключение правила max-len через /* eslint-disable max-len */ внутри блока <style> не работает. Как запретить проверять style блоки или как отключать правила внутри этого блока?

eslint проверяет блок <style> в однофайловом компоненте и ругается на длину некоторых строк. Отключение правила max-len через /* eslint-disable max-len */ внутри блока <style> не работает. Как запретить проверять style блоки или как отключать правила внутри этого блока?

на крон поставил)

eslint проверяет блок <style> в однофайловом компоненте и ругается на длину некоторых строк. Отключение правила max-len через /* eslint-disable max-len */ внутри блока <style> не работает. Как запретить проверять style блоки или как отключать правила внутри этого блока?

https://eslint.org/docs/user-guide/configuring.html#configuring-rules

https://eslint.org/docs/user-guide/configuring.html#configuring-rules

У меня отлично сконфигурировано всё, но внутри CSS есть подключение шрифтов, там длинная строка, которая выбивается за разрешенную длину. И как я написал - отключение правил не работает в style блоке.

на крон поставил)

А я на зеро поставил

У меня отлично сконфигурировано всё, но внутри CSS есть подключение шрифтов, там длинная строка, которая выбивается за разрешенную длину. И как я написал - отключение правил не работает в style блоке.

https://stackoverflow.com/questions/34764287/turning-off-eslint-rule-for-a-specific-file

так там можно просто файл убрать с обработки и строки

А я не хочу убирать этот файл из обработки. Это компонент, в котором есть разметка и код. Я хочу убрать из обработки только один style-блок. И здесь нет ничего подобного https://github.com/vuejs/eslint-plugin-vue

парни, привет, у меня интересный случай, хз что делать на 2х страницах один и тот же код -> чекбокс с v-model и @change, но на 1 странице хендлер срабатывает после модела, а на другой до

в чем проблема может быть?

А я не хочу убирать этот файл из обработки. Это компонент, в котором есть разметка и код. Я хочу убрать из обработки только один style-блок. И здесь нет ничего подобного https://github.com/vuejs/eslint-plugin-vue

а это что?

Кто ж вас читать то учит? В style блоке это не работает

в nuxt 2.0 у меня почему-то middleware отрабатывает на запрос нескольких css и js документов . Ето баг nuxta или как?

Кто ж вас читать то учит? В style блоке это не работает

кинь тогда настройки linta и ошибку с консоли

Народ, когда-то давно вроде уже писал с такой проблемой, но забыл решение. Когда у именованного слота указываю slot-scope="data", то внутри компонента в котором должен отрисоваться этот слот $slots['slot-name'] - пустое, если убрать атрибут slot-scope - он появляется и нендерится\

могу дать подробности если имеет смысл

кинь тогда настройки linta и ошибку с консоли

https://pastebin.com/NUzEE22J ⚠️ http://eslint.org/docs/rules/max-len Line 82 exceeds the maximum line length of 100 src/App.vue:82:1

Народ, когда-то давно вроде уже писал с такой проблемой, но забыл решение. Когда у именованного слота указываю slot-scope="data", то внутри компонента в котором должен отрисоваться этот слот $slots['slot-name'] - пустое, если убрать атрибут slot-scope - он появляется и нендерится\

дак используй data.item

я имею в виду вот это. Если добавить атрибут slot-scope - то слот не рендерится в компоненте, как будто его нет

я имею в виду вот это. Если добавить атрибут slot-scope - то слот не рендерится в компоненте, как будто его нет

какая версия vue и vuetify?

какая версия vue и vuetify?

vue 2.5.2

vuetify - нет

странно, теперь заработало

https://medium.com/@pavelgonzales/best-practices-%D0%B0%D0%B2%D1%82%D0%BE%D1%80%D0%B8%D0%B7%D0%B0%D1%86%D0%B8%D0%B8-%D0%B4%D0%BB%D1%8F-vue-8b769589001a На сколько это годный материал? Как мне показалось все ок, может есть что добавить?

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

что есть интересного в экосистеме vue типа vuetify?

buefy

https://buefy.github.io/

https://vuematerial.io/

нее, последний нахер)

я на нем сделал один проект

глючный он

фреймворк этот

https://element.eleme.io/

тоже прикольный) пока bulma больше зашла из всех, последний тоже ничего

https://vuikit.js.org/

https://vuikit.js.org/

это что за зверь?

довольно таки хороший css фреймворк от yootheme

https://getuikit.com/

https://medium.com/@pavelgonzales/best-practices-%D0%B0%D0%B2%D1%82%D0%BE%D1%80%D0%B8%D0%B7%D0%B0%D1%86%D0%B8%D0%B8-%D0%B4%D0%BB%D1%8F-vue-8b769589001a На сколько это годный материал? Как мне показалось все ок, может есть что добавить?

Очень даже годный - смотри там репу сразу - будет понятнее

ERROR: S client not available

Очень даже годный - смотри там репу сразу - будет понятнее

Спасибо

https://medium.com/@pavelgonzales/best-practices-%D0%B0%D0%B2%D1%82%D0%BE%D1%80%D0%B8%D0%B7%D0%B0%D1%86%D0%B8%D0%B8-%D0%B4%D0%BB%D1%8F-vue-8b769589001a На сколько это годный материал? Как мне показалось все ок, может есть что добавить?

1 - апи слой всегда следует отделять от стора.

глупости

2 - axios.defaults.headers.common['Authorization'] = token И вдруг появляется еще не только наше апи/бэк и сразу же нужно переаисывать и эту часть

created: function () { axios.interceptors.response.use(undefined, function (err) { return new Promise(function (resolve, reject) { if (err.status === 401 && err.config && !err.config.__isRetryRequest) { // if you ever get an unauthorized, logout the user this.$store.dispatch(AUTH_LOGOUT) // you can also redirect to /login if needed ! } throw err; }); }); }

нет ниодной причины добавлять этот лишний слой, в actions делаешь все апи колы и все. делать лишние слои только для того чтоб делать слои зачем?

почему мутация АПИ слоя в created вообще? Как оно связано?

нет ниодной причины добавлять этот лишний слой, в actions делаешь все апи колы и все. делать лишние слои только для того чтоб делать слои зачем?

ну-ну)

Если вам нравится так писать - пишите.

Заключение Что мы сделали? Мы изолировали логику авторизации от приложения и других библиотек. Нам не нужно в каждом запросе явно указывать токен в заголовках. Мы обрабатываем все неавторизированные вызовы API. У нас есть автоматическая аутентификация. У нас есть ограниченный доступ к маршрутам.

1 - СОВСЕМ не изолировали

обертка (apiservice) над оберткой(axios), и в еще одной обертке(vuex actions). назовите хоть одну причину для чего это.

2 - изменили глобальный апи клиент, а не инстанс.

обертка (apiservice) над оберткой(axios), и в еще одной обертке(vuex actions). назовите хоть одну причину для чего это.

стор для хранения стейта. более мощная абстракция которая вам понадобится быстрее, чем вы думаете.

в таком случае ваши экшены будут выглядеть типо myapiservice.get().then(.....) чем это отличаетсяот такого же синтаксисаа axios?

У тебя изменилось название метода в API, метод используется в форме axios.get('/api/v1/blabla') в 6 местах :) будешь в 6 местах править? это самый банальный пример

так не нужно статично забивать)

обертка (apiservice) над оберткой(axios), и в еще одной обертке(vuex actions). назовите хоть одну причину для чего это.

Если ваше приложение маленькое - пишите так. Это оправдано. Если оно большое, или хотя бы среднее - вы заставите себя страдать: - нельзя обновить и заменить библиотеку запросов (а это вам понадобится) - чуть-чуто переписываем всё и получаем баги, особенно если не покрыто тестами Элементарно - DRY.

https://itnext.io/move-your-api-outside-your-application-b07ba6809412?source=user_profile---------1---------------------

И потом у вас 1 экшен зависит от другого, потому что нужно сделать 2 запроса.

тоже забавный момент)

что будете делать?

переписывать экшены?)

второе : ты похоже объявил одноименное свойство и в data, и в props. Но вообще неплохо было бы код посмотреть)

а если нужно 2 поведения? с зависимым и не зависимымыми запросами

Вы исходники посмотрели? Че развели тут

Привет, хочу после загрузки компонента убрать loader и сыпется ошибка: Computed property "loading" was assigned to but it has no setter. Никто не сталкивался?

Привет, хочу после загрузки компонента убрать loader и сыпется ошибка: Computed property "loading" was assigned to but it has no setter. Никто не сталкивался?

Там же английским по белому написано: ты пытаешься менять computed свойство, у которого нету сеттера. Не надо так