## ~たりとも～ない
「~たりとも～ない」是一个日语语法结构，用来表示即使是很小的数量或程度也不做某事，或者即使是很小的数量或程度也不允许某事发生。这个结构强调了即使是最小的部分也不被接受或允许，通常用于表达严格的要求或禁止。

接续方式：
「名詞」 + 「たりとも」 + 「動詞否定形」

例句从简单到复杂：

1. 一滴たりとも水を無駄にしないでください。
     （请不要浪费一滴水。）

2. 一瞬たりとも目を離さないでください。
     （请不要有一瞬间的疏忽。）

3. 一円たりとも無駄にしないでください。
     （请不要浪费一分钱。）

4. 一言たりとも言い訳を許しません。
     （我不会允许任何借口。）

5. 一歩たりとも後退しないでください。
     （请不要后退一步。）

「~たりとも～ない」这个结构在日语中常用于表达严格的要求或禁止，强调即使是最小的部分也不被接受或允许。它在书面语和正式场合的口语中使用较多。

## ～すら
「～すら」是一个日语语法结构，用来表示“甚至连……也……”或“即使……也……”。这个结构强调了即使是最小的部分或最不显眼的事物也具有某种特征或行为，或者即使是最小的部分或最不显眼的事物也未能幸免。它通常用于表达惊讶、失望或强调某种极端的情况。

接续方式：
「名詞」 + 「すら」
「動詞辞書形」 + 「すら」

例句从简单到复杂：

1. 彼は忙しくて、食事すら忘れている。
     （他很忙，甚至连饭都忘了吃。）

2. この問題は難しすぎて、専門家すら解けない。
     （这个问题太难了，即使是专家也解不开。）

3. 彼女は悲しすぎて、涙すら出ない。
     （她悲伤得连眼泪都流不出来。）

4. その映画はつまらなすぎて、観客すら退屈している。
     （那部电影无聊到连观众都感到厌烦。）

5. 彼は病気で、ベッドから起きるすらできない。
     （他因为生病，甚至连起床都做不到。）

「～すら」这个结构在日语中常用于表达惊讶、失望或强调某种极端的情况，它在口语和书面语中都广泛使用。


## ～だに
「～だに」是一个日语语法结构，用来表示“即使……也……”或“连……也……”。这个结构强调了即使是最小的部分或最不显眼的事物也具有某种特征或行为，或者即使是最小的部分或最不显眼的事物也未能幸免。它通常用于表达惊讶、失望或强调某种极端的情况。

接续方式：
「名詞」 + 「だに」
「動詞辞書形」 + 「だに」

例句从简单到复杂：

1. 彼は忙しくて、食事だに忘れている。
      （他很忙，甚至连饭都忘了吃。）

2. この問題は難しすぎて、専門家だに解けない。
      （这个问题太难了，即使是专家也解不开。）

3. 彼女は悲しすぎて、涙だに流れない。
      （她悲伤得连眼泪都流不出来。）

4. その映画はつまらなすぎて、観客だに退屈している。
      （那部电影无聊到连观众都感到厌烦。）

5. 彼は病気で、ベッドから起きるだにできない。
      （他因为生病，甚至连起床都做不到。）
## ～だに
「～だに」这个结构在日语中常用于表达惊讶、失望或强调某种极端的情况，它在口语和书面语中都广泛使用。抱歉，上文中出现了重复错误，我将重新组织回答：
「～だに」是一个日语语法结构，用来表示“即使……也……”或“连……也……”。这个结构强调了即使是最小的部分或最不显眼的事物也具有某种特征或行为，或者即使是最小的部分或最不显眼的事物也未能幸免。它通常用于表达惊讶、失望或强调某种极端的情况。

接续方式：
「名詞」 + 「だに」
「動詞辞書形」 + 「だに」

例句从简单到复杂：

1. 彼は忙しくて、食事だに忘れている。
   （他很忙，甚至连饭都忘了吃。）

2. この問題は難しすぎて、専門家だに解けない。
   （这个问题太难了，即使是专家也解不开。）

3. 彼女は悲しすぎて、涙だに流れない。
   （她悲伤得连眼泪都流不出来。）

4. その映画はつまらなすぎて、観客だに退屈している。
   （那部电影无聊到连观众都感到厌烦。）

5. 彼は病気で、ベッドから起きるだにできない。
   （他因为生病，甚至连起床都做不到。）

「～だに」这个结构在日语中常用于表达惊讶、失望或强调某种极端的情况，它在口语和书面语中都广泛使用。


## ～にして
「～にして」是一个日语语法结构，用来表示“即使是……也……”或“尽管……但是……”。这个结构强调了即使在某种特定的条件下，某事仍然成立或发生了。它通常用于表达对比或让步，指出即使在某种特定的条件下，情况或结果仍然如预期或相反。

接续方式：
「名詞」 + 「にして」
「動詞辞書形」 + 「にして」

例句从简单到复杂：

1. 小さいにして、彼女はとても強い。
    （尽管她个子小，但她非常坚强。）

2. 難しいにして、この問題は解ける。
    （尽管这个问题很难，但还是可以解决的。）

3. お金がなくても、彼は幸せだ。
    （即使没有钱，他也感到幸福。）

4. 一人でにして、彼はこの仕事を成し遂げた。
    （尽管是一个人，但他完成了这项工作。）

5. たとえ遠くにして、彼女は必ず来てくれるだろう。
    （即使很远，她也一定会来的。）

「～にして」这个结构在日语中常用于表达对比或让步，它在口语和书面语中都广泛使用。

## ～あっての
「～あっての」是一个日语语法结构，用来表示“正因为有……才……”或“有了……才有……”。这个结构强调了某个条件或事物的存在是实现另一个事物或情况的前提或必要条件。它通常用于表达因果关系，指出没有前者就没有后者。

接续方式：
「名詞」 + 「あっての」 + 「名詞/動詞」
「動詞辞書形」 + 「あっての」 + 「名詞/動詞」

例句从简单到复杂：

1. 彼あってのこの成功だ。
    （正因为有他，才有了这个成功。）

2. 仲間あっての勝利だ。
    （有了伙伴们，才有了胜利。）

3. 働くことあっての生活だ。
    （有了工作，才有生活。）

4. 健康あっての幸せだ。
    （有了健康，才有幸福。）

5. 信頼あっての友情だ。
    （有了信任，才有友情。）

「～あっての」这个结构在日语中常用于表达对某人或某事物的依赖或感激，它在口语和书面语中都广泛使用。


## ～からある、～からする、～からの
「～からある」、「～からする」、「～からの」是日语中表示数量、程度或价值的语法结构，它们用于强调某个事物的大小、价值或重要性。这些结构通常用于口语和书面语中，表达对某事物的评价或强调。

1. 「～からある」
这个结构用来表示某物的数量或大小达到了一定的程度，强调了数量或大小的显著性。

接续方式：
「名詞」 + 「からある」

例句：
- その箱にはリンゴが百個からある。
  （那个箱子里有超过一百个苹果。）

2. 「～からする」
这个结构用来表示某物的价值、价格或重要性达到了一定的程度，强调了价值或重要性的显著性。

接续方式：
「名詞」 + 「からする」

例句：
- この宝石は五百万円からする。
  （这个宝石价值五百万日元。）

3. 「～からの」
这个结构用来表示某物的来源或起点，强调了从某个特定的点或位置开始。

接续方式：
「名詞」 + 「からの」

例句：
- 彼はアメリカからの留学生だ。
  （他是从美国来的留学生。）

请注意，这些结构在现代日语中使用较少，它们可能在某些特定的语境或文学作品中出现。在日常会话中，人们通常会使用更加直接的表达方式来传达相同的意思。

N１语法第十七弹--强调

还是喜欢这样的路由管理，单独拆封成一个文件，
```jsx

import { createBrowserRouter } from 'react-router-dom';

import App from'../App';
import Login from '../pages/login/login';
import Home from '../pages/home/Home';


const routes = [
  {
    path: '/',
    element: <Navigate to="/login" replace />, // 重定向路由,replace 属性表示使用替换模式进行重定向，这样不会在历史记录中留下 / 路径的记录
  
  },
  {
    path: '/login',
    element: <Login/>
  },
  {
    path: '/home',
    element: <Home/>

  }
];


const router = createBrowserRouter(routes);
export default router;

```
想在React里面实现类似路由守卫的功能，也就是在前往/home页面的时候检测用户是否登录对访问进行拦截，在vue里面，使用下面的代码
```js
const router = createRouter({
  history: createWebHistory(),
  routes,
});

// 全局前置守卫
router.beforeEach((to, from, next) => {
  const isAuthenticated = localStorage.getItem('token'); // 检查 localStorage 中的 token

  if (to.matched.some(record => record.meta.requiresAuth)) {
    // 如果目标路由需要认证
    if (!isAuthenticated) {
      // 如果未登录，重定向到登录页面
      next('/login');
    } else {
      // 如果已登录，继续导航
      next();
    }
  } else {
    // 如果目标路由不需要认证，继续导航
    next();
  }
});

export default router;
```
在React我们可以用自定义Hook实现，使用useEffect hook，他会在组件渲染前进行执行一次，只需要在执行时检查用户凭证就好
刚开始是这样

```jsx
import { useEffect } from 'react';
import { useNavigate } from 'react-router-dom';

const useAuth = () => {
  const navigate = useNavigate();

  useEffect(() => {
    // 检查 localStorage 中的 token
    const token = localStorage.getItem('token');

    if (!token) {
      navigate('/login', { replace: true });
    }
  }, [navigate]);

  return null;
};

export default useAuth;



// Home.jsx


const Home = () => {
    useAuth();
    return ...
}
```

这样的代码没问题，他会在跳转Home页面检查登陆凭证，并拦截跳转到Home,但是不完美，因为会出现一瞬间的Home页面，代表重定向前组件已经渲染，我们只需要做一点简单的判断，修改一下自定义Hook
```jsx
import { useState, useEffect } from 'react';
import { useNavigate } from 'react-router-dom';

const useAuth = () => {
  const [isAuthenticated, setIsAuthenticated] = useState(false);
  const navigate = useNavigate();

  useEffect(() => {
    // 检查 localStorage 中的 token
    const token = localStorage.getItem('token');

    if (token) {
      setIsAuthenticated(true);
    } else {
      navigate('/login', { replace: true });
    }
  }, [navigate]);

  return isAuthenticated;
};

export default useAuth;


// Home.jsx

  const isAuthenticated = useAuth(); // 使用自定义 Hook 进行权限检查

  if (!isAuthenticated) {
    return null; // 如果未认证，返回 null 不渲染组件
  }


```
但我不确定这是不是最佳实践



![image.png](/static/img/eca451e74a7736559298d485fb68a762.image.webp)

今晚就先这样


React编码记录

Fiber学习


## に至って
「に至って」和「に至っても」是两个相关的日语语法结构，它们用来表示事情发展到了某个阶段或程度，或者即使到了某个阶段或程度。这两个结构强调了事情的进展或结果，以及在特定情况下的行为或态度。

1. 「に至って」
这个结构用来表示事情发展到了某个特定的阶段或程度，通常暗示着事情已经达到了一个重要的转折点或高潮。

接续方式：
「名詞」 + 「に至って」
「動詞連体形」 + 「に至って」

例句：
- 彼は最後の瞬間に至って、ようやく真実を語った。
  （他在最后一刻终于说出了真相。）
- 会議の最後に至って、ようやく問題が解決した。
  （会议到了最后，问题终于得到了解决。）

2. 「に至っても」
这个结构用来表示即使事情发展到了某个阶段或程度，情况依然没有改变，或者某人依然保持某种态度或行为。

接续方式：
「名詞」 + 「に至っても」
「動詞連体形」 + 「に至っても」

例句：
- 期限に至っても、彼はまだ仕上げていなかった。
  （即使到了期限，他还是没有完成。）
- 何回説明に至っても、彼は理解しようとしない。
  （即使解释了很多次，他还是不愿意理解。）

这两个结构在日语中常用于书面语和正式场合的口语中，用来强调事情发展的阶段或程度，以及在特定情况下的行为或态度。


## ~に至っては
「~に至っては」是一个日语语法结构，用来表示当事情发展到某个特定的阶段或程度时，情况已经变得非常严重或特别，以至于需要采取特别的措施或应对方法。这个结构强调了事情的严重性或问题的紧迫性，暗示着到了这个阶段，通常的处理方式已经不再适用。

接续方式：
「名詞」 + 「に至っては」
「動詞連体形」 + 「に至っては」

例句从简单到复杂：

1. この問題に至っては、専門家の意見を聞くしかない。
   （到了这个问题，只能听取专家的意见。）

2. ここまで悪化に至っては、もう手遅れかもしれない。
   （到了这种恶化程度，可能已经为时已晚。）

3. 彼の態度に至っては、もう我慢の限界だ。
   （他的态度到了这个地步，我已经忍无可忍了。）

4. 事故が発生してからでは遅すぎる。予防策を講じるべきに至っては、今しかない。
   （事故发生后再采取措施就太迟了。到了需要采取预防措施的地步，现在是唯一的机会。）

5. ここまで来ると、全面的な改革に至っては避けられないだろう。
   （到了这个地步，全面的改革恐怕是不可避免的了。）

「~に至っては」这个结构在日语中常用于表达对当前状况的严重关切或对问题紧迫性的认识，它在书面语和正式场合的口语中使用较多。

## ~始末だ
「~始末だ」是一个日语语法结构，用来表达某事的状况或结果达到了令人遗憾、失望或难以接受的程度。这个结构通常带有负面的情感色彩，强调了事情的严重性或问题的复杂性。它由「始末」（しょくまつ）这个词和助词「だ」组成，「始末」在这里表示事情的经过或结果。

接续方式：
「動詞連体形」 + 「始末だ」

例句从简单到复杂：

1. 彼は約束を守らず、結局は信頼を失う始末だ。
    （他没有遵守约定，结果是失去了信任。）

2. せっかくのチャンスを逃してしまって、後悔する始末だ。
    （错过了难得的机会，结果是感到后悔。）

3. そのプロジェクトは予算オーバーで、混乱する始末だ。
    （那个项目超出了预算，结果是一片混乱。）

4. 彼女は一生懸命勉強したのに、試験に落ちて、残念な始末だ。
    （她尽管努力学习，但考试还是没通过，真是令人遗憾。）

5. あの人はいつも遅刻ばかりで、信用を失う始末だ。
    （那个人总是迟到，结果是失去了信用。）

「~始末だ」这个结构在日语中常用于口语和书面语中，用来表达对某事结果的不满或失望。它能够有效地传达出说话者对于事情状况的负面评价。

## ~っぱなしだ
「~っぱなしだ」是一个日语语法结构，用来表示某动作或状态一直持续着，没有改变或结束。这个结构通常带有负面的含义，暗示着某种情况或行为的持续是不理想的、不受欢迎的，或者需要被解决。它由「っぱなし」（表示动作或状态的持续）和「だ」（助动词，表示状态）组成。

接续方式：
「動詞ます形」 + 「っぱなし」 + 「だ」

例句从简单到复杂：

1. この部屋は散らかったっぱなしで、片付けないといけない。
    （这个房间乱七八糟的，得收拾一下。）

2. 机の上に置いたままの本は、読んだっぱなしにしてはいけない。
    （桌子上放着的书，不能读完就不管了。）

3. 彼は約束を破ったっぱなしで、謝罪もしない。
    （他违反了约定，却连道歉都没有。）

4. 仕事の資料を机の上に散らかしたっぱなしで、出かけた。
    （他把工作资料乱放在桌上就出门了。）

5. この問題は放置したっぱなしでは、解決しないだろう。
    （这个问题如果一直置之不理，是不会得到解决的。）

「~っぱなしだ」这个结构在日语中常用于口语和书面语中，用来指出某事需要被处理或改善，因为持续的状态是不恰当的。它能够有效地传达出说话者对于持续状况的不满或担忧。


N1语法第十六弹--结尾，最终状态

今天工作很早结束，趁着空闲时间研究了一下React,因为前端功底不怎么好，所以研究了很久，研究出来这么个东西，之前一直在想把iTakeaway的IM服务整理出来，但是最近忙于项目汇报和赶进度，没时间弄，后面再找时间吧，可以搭配React写一个仿微信的，但是只是仅仅支持聊天的程序，技术栈就React + Go

下午做了一些原型验证


![image.png](/static/img/80044c24ad691dff4aa926cfaecc1cbf.image.webp)

这个是仿的微信Style的登陆页面，，因为是在浏览器实现，但是又不想做全屏（谁家用微信全屏），所以说就做成平常大小，但是这个微信窗口是可以拖动，上下左右拖动

我工作主要是Golang和Vue3，Vue3主要是简单的后台管理系统，React知识学习了基础知识，所以还不是很清楚一些功能怎么实现，Vue里面做过拖动的Dialog,但是React,还没有，所以我把这个登陆页面做成了拖动的


![QQ2024111-02935.gif](/static/img/e0c50fe942f7cfe75f95da33cd3daf62.QQ2024111-02935.gif)

这样虽然没什么用，但是很方便

```
npm install react-draggable
```
安装这个插件，用Draggable组件包裹你的组件代码就可以，[他的文档在这里](https://juejin.cn/post/7206974675027984443)，它支持用参数设置初始位置，也就是组件渲染后的位置，但是更好的方式是用css去定义初始位置，比如居中

用这个属性可以设置在容器上显示游标，但是我觉得很丑

```

    cursor: move;
```

为了不再拖动的时候出现横纵滚动条影响美观，
```
  html, body {
    overflow: hidden;
    height: 100vh;
  }
```
添加这个属性，完全满足我的需求