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
|
import React from "react";
import { createRoot } from "react-dom/client";
import { createHashRouter, RouterProvider } from "react-router-dom";
import Root from "./root";
import List from "./pages/list";
import Echo from "./pages/echo";
const router = createHashRouter([
{
path: "/",
element: <Root />,
// loader: rootLoader,
children: [
{
path: "",
element: <List />,
loader: () => {
return fetch("/api/list").then((x) => x.json());
},
},
{
path: "e/:echoID",
element: <Echo />,
loader: async ({ params }) => {
const echoData = await fetch(
`/api/e?e=${params.echoID}&limit=10`
).then((x) => x.json());
let echo = [];
if (echoData[params.echoID]) {
echo = echoData[params.echoID];
}
const messages = await fetch(
`/api/m?e=${params.echoID}`
).then((x) => x.json());
return { echo, messages: messages.reverse() };
},
},
],
},
]);
const root = createRoot(document.getElementById("app"));
root.render(
<RouterProvider
router={router}
fallbackElement={<article aria-busy="true">Загрузка</article>}
/>
);
|