В dev режиме контент выводится без проблем, но на билде в месте вывода контента <router-view></router-view> появляется только блок с пустым комментарием <!—->. Проблема в том, что файл открывается в браузере через file:///: Некоторые API браузера работают только при открытии файла через http://…. Таким образом, если убрать в файле routes.js history mode или поменять на hash … подробнее
При написание небольшого проекта на VueJS столкнулся с проблемой при настройке роутинга на кнопках, а именно при подвешивании события:
|
1 |
<router-link to="path/to" @click="someFunction"> |
— роутинг отрабатывал, но никакого запланированного события не происходило. На сколько я понял, директива v-on работает только с нативными HTML-элементами, т.к. это браузерное событие, а не событие Vue. Одним из выходом из этой ситуации может … подробнее
Здравствуйте, коллеги. Чуть ниже представлен алгоритм написания ToDo листа на jQuery с использованием локального хранилища LocalStorage + возможность редактирования и удаления каждой отдельной задачи из списка. В результате получиться должно следующее — демо. За код прошу строго не судить, т.к. в JS я только начинаю. Однако дельным советам я буду только рад. Поехали. Для начала … подробнее
Сразу предупрежу, что далее я описываю конкретное (одно) решение снятия нагрузки на сервер. Оно может как помочь, так и быть бесполезным в вашем случае… Получил недавно письмо от своего хостинг-провайдера о том, что мой аккаунт генерирует нагрузку на сервер. В админке аккаунта было следующее: И вряд ли мои сайты стали за пару дней такими популярными. Бонусом … подробнее
Тема справедлива так же для растягивания ширины при неизменной высоте. На самом деле задача немного специфичная, ведь зачем сознательно искажать картинку/иконку, тем не менее случаи бывают разные. В моем случае нужно было сделать блок, который при наличии контента растягивался бы по высоте и его «уголок» был адаптивным. Саму рабочую конструкцию вставлять не буду, т.к. запись … подробнее
Когда вы переносите сайт с одного хостинга на другой и при этом домен остается прежним иногда возникает необходимость проверить обновились ли DNS-сервера у регистратора и ссылается ли старый домен на новый хостинг, дабы понять, что перенос прошел успешно. Есть разные способы, но я использую, наверное, один из самых простых. Создаю обычный txt-файл с именем, например, … подробнее
В 2017 году пришлось мне поддерживать сайт на Joomla 2.5… Ужасно не удобно, но обновляться с учетом тех костылей, с которыми мне отдали сайта, я пока не решаюсь, да и времени совсем нет. В общем стандартная проблема редактора Tiny MCE — режет безбожно верстку со всеми тегами. Стандартные настройки типа «Очищать код при запуске/сохранении» не … подробнее
Когда тонер в картридже подошел к концу, а покупать новый либо негде, либо жаба душит — проще новый принтер купить, то картридж заправляют новым тонером за 800 руб. и ты радуешься … до тех пор, пока не вставляешь картридж обратно в свой Brother DCP 1512R и не видишь тоже самое сообщение: «Мало тонера». Сначала я … подробнее
В момент написания заметки поддержка flexbox браузерами составляет 86,3% без использования префиксов и 97,7% с ними. Данная заметка — шпаргалка по префиксам для свойств flex-контейнера и flex-элементов.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 |
/********************************* префиксы для flex-контейнера *********************************/ .flex { display: flex; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: inline-flex; display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; flex-direction: column; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-wrap: wrap; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-flow: column wrap; -webkit-flex-flow: column wrap; -ms-flex-flow: column wrap; justify-content: space-between; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; align-content: space-around; -webkit-align-content: space-around; -ms-flex-line-pack: distribute; align-items: center -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; } /****************************** префиксы для flex-элементов ******************************/ .flex-item { flex-grow: 1; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-shrink: 3; -webkit-flex-shrink: 3; -ms-flex-negative: 3; flex-basis: 200px; -webkit-flex-basis: 200px; -ms-flex-preferred-size: 200px; flex: 1 3 200px; -webkit-box-flex: 1; -webkit-flex: 1 3 200px; -ms-flex: 1 3 200px; align-self: center; -webkit-align-self: center; -ms-flex-item-align: center; order: 3; -webkit-box-ordinal-group: 3; -webkit-order: 3; -ms-flex-order: 3; } |
Данный кусочек относительно использования префиксов взят из объемной статьи по flexbox’ам с другого источника.
К сожалению, в маркетплейсе битрикса, на странице компонента сами разработчики прекратили уже давно отвечать на вопросы и, полагаю, окончили поддержку данного решения. Одним из вопросов, волнующих пользователей данного решения, стал: «как создать несколько слайдеров на одной странице». В описании к слайдеру и в faq данный вопрос не поднимается. Так вот, для того, чтобы вызвать данный … подробнее