В html есть такой замечательный элемент, как picture, предоставляющий возможность грузить разные изображения в зависимости от медиа-запроса. И все бы хорошо, но проблема появляется при использовании компонентного подхода.
В своем проекте я…
Есть компонента, которую я вывожу у себя в приложении:
function DetailBlock(){
fetch(‘https://boiling-refuge-66454.herokuapp.com/images’)
.then(response=>response.json())
.then(json=> console.log(json…
На сайте есть 2 товара в виде карточки. Они идентичны лишь отличаются контентом.
У 1-ой карточки изображения приходят с сервера, а у 2-ой оно всегда статичное и + там текст.
Сейчас код компонента карточки с картинкой выглядит так:
const …
Не секрет, что в последние годы веб развивается крайне стремительно. Периодически выходят новые библиотеки, фреймворки и другие полезные для нас инструменты. Всё это безусловно помогает нам решать повседневные задачи. Но в погоне за популярными новинками мы совсем не обращаем внимание на истоки. Многие начинающие разработчики начинают знакомство с кодом именно с инструментов, а не с […]
Перевод статьи Prevent layout shifts with CSS grid stacks с сайта www.hsablonniere.com для css-live.ru, автор — Юбер Саблоньер Люди используют CSS Grid по двум причинам: CSS — это потрясающе! Факт, как ни крути. Гриды — отличный инструмент для создания сложных двумерных макетов. У меня иногда бывает третья причина использовать CSS Grid: предотвратить сдвиги в верстке. […]
Почему у меня уходит в бесконечный цикл? Что я делаю не так?
Известны поля объекта, они не изменяются и идет сравнение именно по ним.
componentDidUpdate(prevProps) {
const { obj, arrHistory } = this.state;
if (!this.isEquals(obj, pre…
слышал что в спринге создание классов помеченных @Component через ключевое слово new является плохой практикой, но так и не смог найти объяснения, почему это плохая практика. Подскажите пожалуйста что почитать или объясните почему это плох…
У меня есть главный компонент App, в его state я передал массив объектов, а потом этот массив объектов передал через пропс в state второго компонента, где с помощью метода map я прошёлся по каждом элементы и отрисовал его. Каждый элемент …
Есть однофайловый компонент parkInfo.vue, я пытаюсь передать с main.js, где регистрируется этот компонент, входной параметр park.
main.js тут регистрирую компонент
Vue.component(
"popup",
require("./vue-components/p…
Изучаю Vue.js
В данных компонента – список булевых значений isOne, определяющих класс div-ов (2 класса – .one и .two, отличающихся цветом рамки), формируемых через v-for.
При клике на i-й div функция изменяет isOne[i], но класс при этом не…
Есть html страница, где будут выводится данные с сервера в определенных блоках.
Допустим блок профиль, где выводится логин пользователя. Каким образом это написать под reactJS? Целиком всю страницу разбить на компоненты или же только один …
Данный пример моего кода работает, но мне нужно получить не конкретный элемент массива, а все его элементы. Судя по всему необходимо использовать foreach внутри функции map, но у меня почему то так не работает. Также прилагаю структуру мас…
Моя версия игры 2048 на чистом js использует pub/sub шаблон проектирования. Один из моих компонентов должен отображать изменения в UI и он это делает, но другой, написанный приблизительно таким же образом – нет. В чем их различие?
(изменен…
В родительском компоненте находиться функциия ajax() , которую я прокидываю в дочерний компонент и там вызываю. Но РЕАКТ выдает ошибку
“./src/components/signin/signin.js
Line 33:20: Parsing error: Unexpected token, expected “;”
…
Есть компонент, модальное окно. При нажатии на кнопку открыть, переменная меняется на true, а при закрытии становится false (через v-if). Суть в том что в компонент, передаются данные, которые меняются при нажатии на разные кнопки, но в ко…
var App = React.createClass({
render: function () {
return (
<form className=”form”>
<h1 className=”form__title”>React</h1>
<div className=”form-wrap”>
<label>Ваш номер те…
Всем привет, возникла такая проблема: есть список элементов с драг н дропом, при добавлении в него нового элемента не происходит ререндер компонента (в стор все приходит) P.S. до добавления днд все работало номрально.
код компонента:
…
Создаю несколько экземпляров класса, как сделать чтобы кнопки отрабатывали сразу для нескольких объектов, а не для последнего?
var inputContainerNode = document.querySelectorAll(‘.emails-input’);
for (let i = 0; i < inputContainerNode…
Есть форма регистрации (созданная через Redux Form), которая отправляет данные на сервер. Если все успешно, происходит redirect, если нет – серверная ошибка выводится на экран. При серверной ошибке можно заблокировать кнопку следующим обра…
На входе – имеем свойство ‘today’, вычисляемое свойство ‘CURRENT_YEAR’ и метод ‘prevYear’.
На выходе – при нажатии на стрелку влево вызывается метод который изменяет свойство (в нашем случае год) и в последствии чего шаблон должен обновить…
Часть 1 1. Введение Большинство пользователей, отвечая на вопрос, что находится в их системном блоке, помимо прочего упоминают винчестер. Винчестер – это устройство, на котором чаще...
Перевод статьи Towards Responsive Elements с сайта bkardell.com, опубликован на CSS-live.ru с разрешения автора — Брайана Карделла В этой статье я расскажу о проблеме «выражений от контейнера», попытаюсь пролить свет на некоторые заблуждения, и ввести вас в курс состояния дел. Наблюдение за стандартами может вогнать разработчика в ступор. Мы можем узнавать о разработке новых спецификаций, появлении новых функций, о которых мы и понятия не имели — возможно, каких-то для нас совсем неважных. При этом «Выражения […]
Всем доброго дня.Новичок в React. Как из этой копипасты превратить код в аккуратную функцию с использованием map в отдельной компоненте, чтобы это аккуратно отображалось в основной компоненте?
<div className={styles.time}>
<d…
Перевод статьи Components and concerns c сайта adactio.com, опубликовано на css-live.ru с разрешения автора — Джереми Кита Порой мы слишком увлекаемся ложными противопоставлениями в мире веб-дизайна и веб-разработки. Недавно я подметил одно, регулярно всплывающее в области дизайн-систем и компонентов. Это…
ДАЛЕЕ
Перевод статьи eqio — A simple, tiny alternative to element/container queries с сайта medium.com для css-live.ru, автор — Мэтт Стоу Классические принципы отзывчивого дизайна больше не отвечают нашим, разработчиков дизайн-систем и библиотек компонентов для веба, потребностям. Если уж с этим согласен Итан…
ДАЛЕЕ
Перевод статьи Responsive Components: a Solution to the Container Queries Problem с сайта philipwalton.com, опубликовано на css-live.ru с разрешения автора — Филипа Уолтона. Выражения от контейнера (Container queries) — предложение, которое позволило бы веб-разработчикам оформлять DOM-элементы в зависимости от размера содержащего их элемента, а не окна браузера….
ДАЛЕЕ
Свежие комментарии