yaparoff

User
  • Content count

    165
  • Joined

  • Last visited

Community Reputation

0 Обычная

About yaparoff

  • Rank
    Участник

Information

  • Sex
    мужской
  • From
    Ижевск

Recent Profile Visitors

3,008 profile views
  1. сборка на gulp много js-файлов которые в итоге компилируются в один js файл Но проблема в том, что в этом компилируемом js файле ставиться табуляция вместо пробела. А на всем проекте 4 пробела вместо табов. И когда я отдаю этот файл бэкэнду начинаются проблемы. Можно как то изменить табы на пробелы в компилируемом файле? Можно это сделать как то автоматически (желательно)? Или только в ручную?
  2. Если в кратце, проблема возникает из за того что когда заходим на страницу изначально текущий урл страницы http://localhost:3004/tablets/tablet_1 Если мы покликаем по табам (у которых тоже реализован роутинг и к урлу добавляется еще значение) То урл будет менять свое значение например на http://localhost:3004/tablets/tablet_1/characteristics И вот, допустим у нас сейчас этот урл и если страница перезагрзиться, то реакт будет считать что текущий урл уже http://localhost:3004/tablets/tablet_1/characteristics а не http://localhost:3004/tablets/tablet_1 как предполагается И из за этого возникают проблемы Могут быть вот такие страницы localhost:3004/tablets/tablet_1/characteristics/characteristics А так быть не должно. Подскажите как решить такую проблему Если подробнее: Делаю Интернет-магазин на Реакте (в рамках учебного проекта) На данный момент сделал роуты для нескольких страниц [JS] <Route path="/" ... /> // главная страница <Route path="/tablets" ... /> // страница категорий <Route path="/tablets/:id" ... /> // детальная страница товара [/JS] И это все работает хорошо Проблема с роутингом началась когда я начал делать табы на детальной странице товара. Их я тоже хотел сделать через роутинг. [JS] <Route path="/tablets/:id/characteristics" ... /> <Route path="/tablets/:id/opinion" ... /> <Route path="/tablets/:id" ... /> // по дефолту [/JS] Пути у табов: [JS] to=`${ текущий урл страницы }/characteristics` // Таб "Характеристки" to=`${ текущий урл страницы }/opinion` // Таб Отзывы to=`${ текущий урл страницы }` // Таб "Описание" (по дефолту) [/JS] http://skrinshoter.ru/s/221019/1f36Q0Gw И это работает исправно, до тех пор пока страница не перезагрузиться. Прикол в том, что если мы кликали по табам, урл менялся и допустим стал таким : http://localhost:3004/tablets/tablet_1/characteristics И потом вдруг страницу перезагрузили А при перезагрузке страницы текущий адрес получается уже http://localhost:3004/tablets/tablet_1/characteristics а не http://localhost:3004/tablets/tablet_1 как задумывалось. Из-за этого возникают проблемы когда кликаешь по табам: адрес получается уже http://localhost:3004/tablets/tablet_1/characteristics/characteristics http://skrinshoter.ru/s/221019/eTe8ZW5F Вот в этом и проблема. Как такое решить? Дело в том что location.pathname я передаю через props дочернему компоненту, он принимает его и в state я добавляю ему [JS]`${ this.props.pathName }/characteristics`[/JS]Вот код, как это выглядит: class App extends Component { render() { <Switch> <Route path="/" exact={true} component={ CategoriesList }/> <Route path="/tablets/:id/characteristics" render={ ({ match, location }) => { const { id } = match.params; return <DetailPage itemId={ id } currentTab="characteristics" pathName={ location.pathname } /> }}/> <Route path="/tablets/:id/opinion" render={ ({ match, location }) => { const { id } = match.params; return <DetailPage itemId={ id } currentTab="opinion" pathName={ location.pathname } /> }}/> <Route path="/tablets/:id" render={ ({ match, location }) => { const { id } = match.params; return <DetailPage itemId={ id } currentTab="description" pathName={ location.pathname } /> }}/> <Route path="/tablets" render={({ location }) => <CategoryPage goodList={goodsList.tablets} title="Tablets" location={ location } exact={true} />} /> </Switch> } } class DetailPage extends Component { state = { tabs: { opinion: { tabId: 'opinionTab', tabTitle: 'Отзывы', tabPathTo: `${ this.props.pathName }/opinion`, tabContent: 'Контент отзывов' }, characteristics: { tabId: 'characteristicsTab', tabTitle: 'Характеристики', tabPathTo: `${ this.props.pathName }/characteristics`, tabContent: 'Контент Характеристик' }, description: { tabId: 'descriptionTab', tabTitle: 'Описание', tabPathTo: `${ this.props.pathName }`, tabContent: 'Контент описания' } } }; findCurrentGood(goodsList, itemId) { for (let key in goodsList) { goodsList[key].forEach(category => { if (category.id === itemId) { this.currentGood = category } }) } } findCurrentTab() { for (let key in this.state.tabs) { if (key === this.props.currentTab) { this.activeTab = this.state.tabs[key]; } } } render() { const { goodsList, itemId, currentTab, pathName } = this.props; const { tabs } = this.state; this.findCurrentGood(goodsList, itemId); this.findCurrentTab(); return() { <div className="tabs"> <div className="tabs__menu"> { Object.keys(tabs).map(tab => { const tabClass = classNames('tabs__link', { 'tabs__link--active' : tab === currentTab }); return ( <Link key={ tabs[tab].tabId } to={ tabs[tab].tabPathTo } className={ tabClass } > { tabs[tab].tabTitle } </Link> ) }) } </div> <div className="tabs__content"> <h3 className="info__title">{ this.activeTab.tabTitle }</h3> <div className="info__text"> { this.activeTab.tabContent } </div> </div> </div> } } }
  3. В проекте над которым работаю, изображения загружаются на некий удаленный сервер 248000.selcdn.ru/cdn/2018/bg_promo-banner.jpg cdn-srv01.miretno.ru/udm-sprite4.png Вопрос как их туда загрузить? Ну или можете просто посоветовать какой-нибудь стабильный удаленный сервер
  4. ну я имею ввиду, то что при ширине экрана от 580 пикс и более
  5. тогда на десктопе будет тоже центроваться, на десктопе нужно по левому краю выравнивать
  6. Верстаю адаптивное email-письмо Эти две картинки должны быть по центру на адаптиве. Но у меня не получается их отцентровать прописываю стили инлайново http://skrinshoter.ru/s/190919/C7ZqQEyh?a Подскажите как это сделать https://codepen.io/yaparoff/pen/GRKwgRX?editors=1000
  7. да, конечно https://codepen.io/yaparoff/pen/vYBzdPm?editors=1000 да http://skrinshoter.ru/s/170919/ZzwPd46V?a
  8. все верно.Но почему то первая ячейка всегда больше чем вторая http://skrinshoter.ru/s/170919/6qCN4vrS Пробовал разные вещи - не помогает
  9. Верстаю email-письмо. Использую Foundation. Не получается сверстать таблицей такой блок http://skrinshoter.ru/s/170919/5k7rvQdR Как его сверстать табличной версткой? https://codepen.io/yaparoff/pen/vYBzdPm?editors=1000
  10. Дизайнер нарисовал макет вот с такими интересными линиями, которые идут по всей высоте сайта http://skrinshoter.ru/s/300819/pJvpKBvC А я теперь вот ломаю голову как такое сверстать. С одной стороны это можно сверстать колонками с рамкой, но ведь есть такие блоки, которые выходят за пределы этих колонок Как тогда быть в таком случае? Такие линии реально идут по всей высоте сайта.
  11. Есть яндекс карта, на десктопе она отображается как надо и мы видим нужный нам объект (адрес) http://skrinshoter.ru/s/230819/RfSZ8pOG а вот если ширина экрана будет меньше, то этот объект уже будет не видно http://skrinshoter.ru/s/230819/74r975D5 Как то можно сделать чтобы было видно этот объект и на мобилках? https://codepen.io/yaparoff/pen/WNeRMNW?editors=1010
  12. Сейчас пришлось обернуть svg в label. И снова не все корректно работает: когда наводишь на серые звезды, они не должны подсвечиваться (в режиме readonly) https://codepen.io/anon/pen/PrmgPj