小编col*_*lby的帖子

在console.log语句上设置断点时，为什么this在调试器中未定义但语句打印没有问题？我是否在这里遗漏了有关范围的内容？

export class OptionsSidebarComponent {

  ... 

  public filters: Object = new Object();

  ... 

  public generateFilters() {
    for (let property in this.terms) {
      if (this.terms.hasOwnProperty(property) && this.terms[property] !== null) {

        if (!this.filters.hasOwnProperty(this.productGroup.id)){
          this.filters[this.productGroup.id] = new Filters();
        }

        this.terms[property].forEach((term) => {
          console.log(this.filters);
        });
      }
    }
  }
}

我希望遍历一组用户（仅设置 id 属性），每两秒使用每个 id 调用一个端点，并将响应中关联的用户名存储到更新的数组中。

例如更新 [{ id: 1 }] 到 [{ id: 1, name: "Leanne Graham" }]

这是我的代码：

const axios = require('axios');

const users = [{ id: 1 }, { id: 2 }, { id: 3 }];

function addNameToUser(user) {
  return new Promise((resolve) => {
    axios.get(`https://jsonplaceholder.typicode.com/users/${user.id}`)
      .then(response => {
        user.name = response.data.name
        resolve(user);
      });
  })
}

const requests = users.map((user, index) => {
  setTimeout(() => {
    return addNameToUser(user);
  }, index * 2000);
});

Promise.all(requests).then((updatedArr) => {
  console.log(updatedArr); …

假设我有一种StudentService方法可以为学生添加课程，另LessonService一种方法是将学生添加到课程中。在我的课程和学生解析器中，我希望能够更新本课程 <---> 学生关系。所以在我的内容中，LessonResolver我有一些类似的东西：

  async assignStudentsToLesson(
    @Args('assignStudentsToLessonInput')
    assignStudentsToLesson: AssignStudentsToLessonInput,
  ) {
    const { lessonId, studentIds } = assignStudentsToLesson;
    await this.studentService.assignLessonToStudents(lessonId, studentIds); **** A.1 ****
    return this.lessonService.assignStudentsToLesson(lessonId, studentIds); **** A.2 ****
  }

和我的基本相反 StudentResolver

上面A.1和A.2之间的区别在于StudentService有权访问StudentRepository和LessonService有权访问LessonRepository- 我相信这遵循了关注点的明确分离。

但是，StudentModule必须导入LessonModule和LessonModule必须导入StudentModule. 这是可以使用该forwardRef方法修复的，但是在NestJS 文档中它提到如果可能的话应该避免这种模式：

虽然应该尽可能避免循环依赖，但你不能总是这样做。（这是其中一种情况吗？）

在使用 DI 时，这似乎应该是一个常见问题，但我正在努力获得关于哪些选项可以消除这种情况的明确答案，或者我是否偶然发现了一种不可避免的情况。

最终目标是让我能够编写以下两个 GraphQL 查询：

query {
  students …

如果我有一个变量，其值可以根据另一个属性的值完全派生，那么初始化计算变量与使用useState/的组合useEffect来跟踪变量是否有任何后果/陷阱？让我用一个人为的例子来说明：

/**
 * ex paymentAmounts: [100, 300, 400]
 */
const Option1 = ({paymentAmounts}) => {
  const [average, setAverage] = useState(paymentAmounts.reduce((acc, curr) => curr + acc, 0) / paymentAmounts.length)

  useEffect(() => {
    setAverage(paymentAmounts.reduce((acc, curr) => curr + acc, 0) / paymentAmounts.length)
  }, [paymentAmounts])

  return (
    <div>
      Average: {average}
    </div>
  )
}

或者更简单地说

/**
 * ex paymentAmounts: [100, 300, 400]
 */
const Option2 = ({paymentAmounts}) => {
  const average = paymentAmounts.reduce((acc, curr) => curr + acc, 0) / …

我正在尝试找到任何示例来概述如何采用现有的 React 应用程序并逐渐开始迁移到 Next.js。我已经阅读了所有有关增量采用策略（例如子路径、重写、微前端、代理）的 Next.js 文档，但尚未找到一个可靠的示例来展示这在现实生活中的“我”实际上是什么样子。我们已经有了一个庞大的 React 代码库”场景。

期望的结果是关闭我现有应用程序的子路径（例如 ），/workshop并且/workshop成为 Next.js 应用程序的入口点。然后，我希望能够在两个应用程序之间无缝导航，尽管一旦您进入 Next.js 领域并且需要从代理中导航回来，其机制似乎很模糊。

为了增加上下文，React 和 Next.js 应用程序都将在 Netlify 上提供服务。我已经仔细阅读了他们的文档以及 Vercel 的文档，寻找一个可行的示例，但我仍然不走运。非常感谢任何有关如何最好地解决此类问题的知识或指导！

我正在我的一个项目中使用react-testing-library，并尝试编写验证应用内路由的测试。

例如，测试 AccessDenied 页面上的按钮是否会将您带回主页。

我已经能够为我的应用程序组件成功编写这些类型的测试，因为它定义了所有应用程序路由。但是，如果 AccessDenied是这些路由之一，我需要如何设置测试来验证单击那里的按钮是否会将我路由回主页？

这是一个人为的例子：

应用程序.tsx

<>
  <Router>
    <Route exact path="/" component={Home} />
    <Route exact path="/access-denied" component={AccessDenied} />
  </Router>
  <Footer />
</>

拒绝访问.tsx

<div>
  <div>Access Denied</div>
  <p>You don't have permission to view the requested page</p>
  <Link to="/">
    <button>Go Home</button>    <--- this is what i want tested
  </Link>
</div>

正如我之前所说，我的测试在内部工作的原因App.test.tsx是因为我的应用程序组件定义了其内部的路由，而我的AccessDenied只是其中之一。App.tsx但是，是否可以在我的测试中利用我定义的路由器AccessDenied.test.tsx？也许我处理这个问题的方式不正确？这就是我挣扎的地方。作为参考，这是我的工作App.test.tsx测试。

应用程序.test.tsx

describe('App', () => {
  it('should allow you to navigate to login', async () => {
    const …