example for use

[romanown]

please give me the example. судя по описанию, компонент позволяет отправлять в яндекс сообщения о переходах между страницами. ибо иначе показывает что все посетили только одну страницу. но исходя из описания не пойму как использовать данный компонент. прошу простейший пример использования на странице сайта.

[narkq]

Ох. Вообще-то да, этот как бы компонент отвечает по сути только за подключение скрипта и хранение списка айдишников. Интеграцию с роутером нужно делать самостоятельно. Что касается примера, ничего не могу обещать, но если руки дойдут, сделаю.

[romanown]

предлагаю в пример добавить что инициализацию делать как и у Вас написано export default withRouter(props => { return ( <div> <YMInitializer accounts={[49433788]} /> <Switch> <Route exact path="/" component={Home} /> и использовать вызов ym(hit) надо в методе componentWillReceiveProps. у меня получилось после обновления работает.

[taime]

Хотелось бы какой-то способ не вставлять на каждую страницу ym('hit', 'path to page'), а где-то в одном месте добавить ym('hit', window.location.pathname + window.location.search) Видел, советы использовать

history.listen((location) => {
  ym('hit', localhost.pathname);
})

Но не удалось добиться, чтобы данный способ работал (непонятно как и куда его вставлять + скорее всего код содержит ошибки.

P.S. еще в readme надо бы добавить пункт установка: yarn add react-yandex-metrika npm install --save react-yandex-metrika

Понятно, что это элементарно, просто иногда бывает, что название репозитория отличается от названия пакета...

[romanown]

так в моих иссуях есть пример кода как я это делал.

[narkq]

Но не удалось добиться, чтобы данный способ работал (непонятно как и куда его вставлять + скорее всего код содержит ошибки.

К сожалению, куда и какой именно вставлять код, зависит от того, каким роутером вы пользуетесь.

[narkq]

@romanown имейте в виду, что componentWillReceiveProps уже помечен как устаревший, и в react 17 будет удален.

[romanown]

тогда вообще непонятно как использовать данный модуль. значит до выхода новой версии модуля не будем обновлять реакт. а там может и Вы успеете что-нибудь придумать. у меня веселее стало. на тестовом сайте работает, а на рабочий поставил, заменив номер счетчика на правильны - и перестало считать посещения и переходы.

[taime]

YMInitializer в какое место нужно помещать? Это место должно быть внутри render() (и тогда вопрос, нужно ли помещать это внутри return) или в componentDIdMount() или в componentWillRecieveProps() или вообще вне компонента?

Также неочевидно, следует ли вместе с этим вставлять в файл index.html обычный код яндекс метрики, или этого делать не следует. И если вставить обычный код яндекс метрике в index.html и не вставлять YMInitializer, то будет ли работать ym('hit', localhost.pathname)

P.S. Вообще все вопросы снимет любой совсем простой базовый пример использования (например в create-react-app).

[bonzoSPb]

@taime я лично просто поместил в компонент footer: import { YMInitializer } from 'react-yandex-metrika'; export default class Footer extends Component { render() { return ( <footer className="row"> <YMInitializer accounts={[*****]} options={{ webvisor: true }} version="2" /> </footer> ); } }

[eseQ]

Обертка для Route из react-router. С другими, думаю примерно так же можно. И используете этот компонент вместо обычного Route.

import React, { useEffect, useRef } from 'react';
import { Route } from 'react-router-dom';
import ym from 'react-yandex-metrika';

const RouteWrapper = ({ meta, ...props }) => {
  const url = (props.location || {}).pathname;
  const { isParent, path } = props;
  const metaRef = useRef();
  const pastPath = (props.lastLocation || {}).pathname;
  metaRef.current = { title: (meta || {}).title, referrer: pastPath };
  const canHit = (meta || {}).ready || (!meta && url !== pastPath);
  useEffect(() => {
    if (!config.isProduction || !path || !url || isParent) return;
    if (!canHit) return;
    const { title, referrer } = metaRef.current;
    const ymOptions = {};
    if (referrer) ymOptions.referer = referrer;
    if (title) ymOptions.title = title;
    ym('hit', url, ymOptions);
  }, [isParent, url, path, canHit]);
  return <Route {...props} />;
};
export default RouteWrapper;

Ну я тут еще и meta передаю. В целом все просто. Можете удалить все что связанно с meta и isParent если не надо =)