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

let _index = 0;

const useIndex = () => {
  const index = useMemo(() => _index++, []);
  // const [index] = useState(_index++); - same problem
  console.log("INDEX", index);
  return index;
};

const useHook = () => {
  const index = useIndex();

  console.log("Now index is", index);

  useEffect(() => {
    return () => {
      console.log(`Remove ${index}`);
    };
  }, []);

  return { index };
};

export default function App() {
  const [isIndex, setIsIndex] = useState(true);
  return (
    <div className="App">
      {isIndex && <NonIndexComponent />}
      {!isIndex && <IndexComponent />}
      <button onClick={() => setIsIndex(!isIndex)}>
        Toggle indexes components
      </button>
    </div>
  );
}

const IndexComponent = () => {
  const { index } = useHook();
  return <h1>My index is {index}</h1>;
};

const NonIndexComponent = () => {
  return <h1>I'm without index</h1>;
};

Вот вывод консоли:

INDEX 0
Now index is 0
 INDEX 1
Now index is 1
// вывод ниже после удаления компонента
Remove 1

Почему один компонент получает разные индексы?

Codesandbox - https://codesandbox.io/s/gallant-hooks-1drpy?file=/src/App.js

родитель рендерится, по идее.

а почему он должен получать одинаковые индексы?

Вообще или исходя из моего кода?

вообще очень хотелось бы узнать проблему, решающую этим хуком.

Нужно держать данные и после удаление удалять данные. Это как useState, только вне компонента.

из твоего кода

Ну, useMemo же одинажды выполниться, (кроме частных случаев) по идеи, и индекс всегда будет один. Но там и строка с useState есть, там точно должен быть один.

ну так на каждый маунт будет вызываться новый инстанс компонента, чтобы отрендериться ему нужно выполнить коллбэк в useMemo

Ну, useMemo же одинажды выполниться, (кроме частных случаев) по идеи, и индекс всегда будет один. Но там и строка с useState есть, там точно должен быть один.

а если тебя смущает, что индекс перескакивает через единицу — удали StrictMode в index.js

а если тебя смущает, что индекс перескакивает через единицу — удали StrictMode в index.js

а если мы все попросим, реакт тима пофиксит стрикт мод? плакала половина чата.

это намеренное поведение. если мы все у дурова попросим, то он пофиксит херню, из-за которой я могу сообщения в телеграм отправлять?

Воу, спасибо. Но все же, можно ли подругому решить?

Народ, посоветуйте плиз книгу, где написано как работает js и его среда выполнения на низком уровне: работа со стеком и кучей, gc, асинхронность, типы данных, jit компиляторы итд. Типа Рихтера для c#. Спасибо заранее!

Воу, спасибо. Но все же, можно ли подругому решить?

Не тот чат. https://t.me/js_ru

Воу, спасибо. Но все же, можно ли подругому решить?