【前端面试】如何深度谈class组件和函数组件的区别

于 2024-08-16 11:20:35 发布
阅读量622 收藏 11
点赞数 6
文章标签： 前端 面试 职场和发展
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43342290/article/details/141223725
版权

React 类组件（Class Components）和函数组件（Function Components）是构建 React 应用程序的两种主要方式。它们在语法、功能和生命周期方面有区别。

基本比较

类组件（Class Components）

  1. 定义方式：使用 ES6 类（class）语法定义。

  2. 状态（State）：可以在类组件中使用 this.state 来定义和管理组件的状态。

  3. 生命周期方法：类组件有多个生命周期钩子，如 componentDidMount、shouldComponentUpdate、componentDidUpdate 和 componentWillUnmount 等。

  4. 实例方法：可以使用 this 关键字访问组件的属性和方法。

  5. 支持继承：类组件可以继承其他类组件，实现代码复用。

  6. 构造函数：使用构造函数（constructor）来初始化 state 或绑定事件处理函数。

    class MyClassComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = { count: 0 };
  }

  componentDidMount() {
    console.log('组件已挂载');
  }

  handleClick = () => {
    this.setState({ count: this.state.count + 1 });
  };

  render() {
    return <button onClick={this.handleClick}>{this.state.count}</button>;
  }
}

函数组件（Function Components）

  1. 定义方式：使用 JavaScript 函数定义。

  2. 状态（State）：在函数组件中，可以使用 useState Hooks 来添加状态。

  3. 生命周期方法：通过使用如 useEffect 的 Hooks 来处理副作用和生命周期逻辑。

  4. 无实例：函数组件没有 this，它们只是返回 JSX。

  5. 无继承：函数组件不支持继承，但可以通过组合或高阶函数来复用逻辑。

  6. Hooks：函数组件可以使用 React 提供的各种 Hooks，如 useState、useEffect、useContext 等。

    import React, { useState, useEffect } from 'react';

function MyFunctionComponent() {
  const [count, setCount] = useState(0);

  useEffect(() => {
    console.log('组件已挂载');
  }, []); // 空依赖数组相当于 componentDidMount

  const handleClick = () => {
    setCount(count + 1);
  };

  return <button onClick={handleClick}>{count}</button>;
}

主要区别

  • 语法：类组件使用类语法，而函数组件使用函数语法。
  • 状态管理：类组件通过 this.state 管理状态，函数组件通过 useState Hook。
  • 生命周期：类组件有生命周期方法，函数组件通过 Hooks 如 useEffect 处理生命周期逻辑。
  • 代码复用：类组件通过继承复用代码，函数组件通过组合或自定义 Hooks 复用逻辑。
  • 性能：函数组件通常更轻量，并且更容易被优化，因为它们没有类组件的额外开销。

React 团队推荐在大多数情况下使用函数组件，因为它们更简洁、易于理解，并且具有 Hooks 带来的强大能力。然而，类组件仍然适用于某些特定场景，特别是需要使用生命周期方法或状态和生命周期逻辑较为复杂的组件。随着 React 的发展，许多类组件的功能已经可以通过 Hooks 在函数组件中实现。

React 类组件和函数组件在性能上的差异

React 类组件和函数组件在性能上的差异通常不是很明显，因为 React 的渲染引擎会针对两者进行优化。

实例化开销：

  • 类组件需要更多的实例化开销，因为它们需要创建一个类实例，这可能涉及到原型链的查找。
  • this 的引用和可能的闭包，可能会占用更多的内存。

原型方法调用：

  • 类组件中的方法调用可能会稍微慢一些，因为它们是通过原型链调用的。

声明式的优化hooks：

  • 使用函数组件和 Hooks，例如 React.memo 或 useMemo，可以更容易地避免组件的不必要渲染。
    useMemo 和 useCallback 提供了一种更声明式和自动化的方式来进行这些优化，而类组件则需要手动管理缓存和引用。随着 React 的发展，推荐使用函数组件和 Hooks，因为它们提供了更简洁和易于维护的方式来构建组件。

补充： useMemo
useMemo Hook 用于记忆化复杂计算的结果，确保当依赖项没有变化时，组件不会进行不必要的计算。

函数组件中的使用：

const memoizedValue = useMemo(() => computeExpensiveValue(a, b), [a, b]);

这里，computeExpensiveValue 函数的执行结果被记忆化，只有当 a 或 b 发生变化时才会重新计算。

类组件中的对应优化：
在类组件中，可以通过缓存计算结果的方式实现类似的优化：

class MyClassComponent extends React.Component {
  componentDidMount() {
    this.cachedValue = this.computeExpensiveValue(this.props.a, this.props.b);
  }

  computeExpensiveValue(a, b) {
    // 复杂计算
  }

  render() {
    // 使用缓存的值
    return <div>{this.cachedValue}</div>;
  }
}

在这个例子中，this.cachedValue 用于存储计算结果，避免在每次渲染时重复计算。

useCallback
useCallback Hook 用于记忆化回调函数，确保回调函数在其依赖项没有变化时保持不变，从而避免不必要的重新渲染。

函数组件中的使用：

const memoizedCallback = useCallback(() => {
  doSomething(a, b);
}, [a, b]);

这里，回调函数的引用在 a 或 b 发生变化时才会更新。

类组件中的对应优化：
在类组件中，可以通过绑定方法或使用 class 字面量属性来确保回调函数的引用不变：

class MyClassComponent extends React.Component {
  handleClick = () => {
    doSomething(this.props.a, this.props.b);
  }

  render() {
    return <button onClick={this.handleClick}>Click me</button>;
  }
}

在这个例子中，handleClick 方法在类定义时就绑定了，因此其引用在组件的整个生命周期中保持不变。

错误处理：

  • 类组件的错误处理可能涉及到更复杂的栈跟踪，这可能会影响性能。
    错误边界：

补充：React 16 及更高版本支持错误边界（Error Boundaries），这是一种特殊类型的组件，可以捕获其子组件树中任何组件的 JavaScript 错误，并提供回退 UI。

代码拆分：

- 函数组件与 React 的懒加载（`React.lazy`）和代码拆分特性更自然地集成。

更新和渲染优化：

  • React 团队对函数组件的更新和渲染流程进行了优化，特别是在使用 Hooks 时。

避免不必要的生命周期调用：

  • 类组件的生命周期方法（如 componentDidUpdate）可能会在不必要的时候被调用，而函数组件的 useEffect 可以更精确地控制副作用。

现代浏览器优化：

- 现代浏览器可能对函数调用有更优化的 JIT（Just-In-Time）编译，这可能使函数组件的性能略优于类组件。

尽管存在这些差异，但在大多数情况下，React 类组件和函数组件的性能差异是可以忽略不计的。React 团队一直在努力优化两者的性能，确保无论选择哪种组件类型，都能获得良好的性能体验。

在实际开发中，选择类组件还是函数组件应基于代码的可维护性、可读性和团队的熟悉度，而不仅仅是性能。随着 React 功能的不断发展，函数组件和 Hooks 提供了一种更现代、更灵活的方式来构建 React 应用程序。

useEffect Hook 模拟类组件

useEffect Hook 在函数组件中非常强大，因为它可以模拟类组件的多个生命周期方法。以下是如何使用 useEffect 来模拟类组件的不同生命周期钩子：

1. componentDidMount / componentDidUpdate

在类组件中，componentDidMount 在组件首次渲染后立即调用，而 componentDidUpdate 在组件更新后调用。在函数组件中，你可以使用一个空依赖数组来模拟这两个钩子：

useEffect(() => {
  // 首次渲染和更新后执行的代码
  console.log('Component mounted or updated');
  // 这里可以执行数据获取、订阅等操作
}, []); // 空依赖数组表示仅在首次渲染时执行

2. componentDidUpdate (带参数)

虽然 useEffect 不直接提供 prevProps 和 prevState 参数，但你可以通过比较新旧 props 或 state 来模拟：

useEffect(() => {
  if (newProps.id !== prevProps.id) {
    console.log('ID has changed:', newProps.id);
  }
  // 其他 props 更新逻辑...
}, [newProps.id]); // 依赖项数组中的 id 发生变化时执行

3. componentWillUnmount

在类组件中，componentWillUnmount 在组件卸载和销毁前调用。在函数组件中，你可以省略依赖数组来模拟这个钩子：

useEffect(() => {
  console.log('Component will unmount');

  // 清理工作，例如取消订阅或定时器
  return () => {
    console.log('Cleanup on unmount');
  };
}, []); // 没有依赖项，仅在组件卸载时执行

4. componentWillMount (UNSAFE_)

虽然 componentWillMount 已被标记为不安全且不推荐使用，但你仍然可以模拟它的行为：

useEffect(() => {
  console.log('Component will mount (UNSAFE)');

  // 执行 componentWillMount 类似的逻辑
}, []); // 空依赖数组，仅在首次渲染前执行

5. componentWillReceiveProps (UNSAFE_)

同样，componentWillReceiveProps 也已被标记为不安全，但可以通过比较新旧 props 来模拟：

useEffect(() => {
  if (nextProps.someProp !== prevProps.someProp) {
    console.log('someProp has changed');
  }
  // 其他属性更新逻辑...
}, [nextProps.someProp]); // 当 someProp 发生变化时执行

注意事项

  • 避免在 useEffect 中执行阻塞浏览器的长时间运行操作，因为这可能导致性能问题。
  • 确保在 useEffect 的清理函数中清除副作用，如取消网络请求、定时器等。
  • 使用 useEffect 模拟生命周期时，要仔细考虑依赖项数组的内容，以确保副作用按预期执行。

通过合理使用 useEffect，你可以在函数组件中实现与类组件相似的生命周期行为，同时享受 Hooks 带来的其他好处。

深度比较：JavaScript 中的多范式支持

JavaScript 语言本身提供了灵活的特性，使其能够适应不同的编程范式：

面向对象编程：通过构造函数、原型和 class 关键字（ES6+）。
过程式编程：通过循环、条件语句和赋值操作。
函数式编程：通过高阶函数（如 map、filter、reduce）、闭包和不可变性。

上述语言风格谈论的更多是使用react的前端开发者的心智模型。
实际，React 都对两种组件做了各自的优化处理。 从 React 最初的版本开始，无论是函数式组件还是类组件，它们都使用了虚拟 DOM（Virtual DOM）的概念。虚拟 DOM 是 React 的一个核心特性，它允许 React 高效地更新和渲染用户界面。

在React中，无论是函数式组件还是类组件，它们从JSX转换为HTML的阶段变化基本上是一致的。
React在编译时将JSX转换为JavaScript对象，这个过程称为“渲染”。

以下是转换过程的简要概述：

  1. 编写JSX：在React组件中使用JSX编写UI。

  2. 编译JSX：React的编译器（如Babel）将JSX转换为React.createElement()调用。

  3. 创建React元素：React.createElement()函数创建一个JavaScript对象，这个对象描述了UI的结构和属性。

  4. 渲染到DOM：React使用这些React元素来生成实际的DOM节点，并将它们插入到页面中。

  5. 更新DOM：当组件的状态或属性发生变化时，React会重新执行上述过程，并更新DOM以反映新的UI。

对于函数式组件和类组件，这个过程是相同的。主要的区别在于它们是如何定义和实现的：

  • 函数式组件：使用简单的JavaScript函数定义，通常用于表示无状态的UI。它们可以接收props作为参数，并返回JSX。

  • 类组件：使用ES6类定义，通常用于表示有状态的UI。它们拥有生命周期方法和状态管理。

尽管它们的实现方式不同，但它们渲染为HTML的方式是一致的。React的渲染引擎不关心组件是如何定义的，只关心组件返回的JSX。因此，无论是函数式组件还是类组件，它们最终都会被转换为DOM节点，以构建用户界面。

补充：

虚拟 DOM 的基本概念：

  • 虚拟 DOM 树：当使用 React 渲染组件时，React 会创建一个轻量级的虚拟 DOM 树，这是一个 JavaScript 对象，代表了实际 DOM 元素及其属性和子元素。

  • 组件实例化：对于类组件，React 会创建一个组件实例，但对于函数式组件，每次渲染时都会调用函数来生成新的虚拟 DOM。

  • 渲染过程：React 首先在虚拟 DOM 中执行更新，然后使用高效的 diff 算法计算出需要在真实 DOM 上进行的最小更新。

  • 更新 DOM：当组件的状态或属性发生变化时，React 会重新创建一个新的虚拟 DOM 树，并与旧的虚拟 DOM 树进行比较，以确定如何高效地更新 DOM。

函数式组件和虚拟 DOM：

  • 无状态：最初的函数式组件通常没有状态，它们只接收 props 并返回虚拟 DOM 元素。

  • 简洁性：函数式组件的简洁性使得它们在某些情况下更容易理解和使用，尤其是在组件不需要维护状态或生命周期方法时。

  • Hooks：React 16.8 引入的 Hooks API 扩展了函数式组件的能力，使得函数式组件也能够使用状态（useState）、副作用（useEffect）和其他 React 特性。

类组件和虚拟 DOM：

  • 状态和生命周期：类组件可以拥有自己的状态（this.state）和生命周期方法，这些方法在虚拟 DOM 更新和 DOM 操作的不同阶段被调用。

  • 实例化：类组件的实例在组件创建时实例化，并在组件的整个生命周期中保持不变。

  • 更新：当类组件的状态或属性发生变化时，React 会触发重新渲染，实例的 render 方法会被调用，生成新的虚拟 DOM。

总结：

虚拟 DOM 是 React 的一个基础概念，它与组件是函数式还是类没有直接关系。无论是函数式组件还是类组件，它们都通过虚拟 DOM 来描述 UI，React 通过比较新旧虚拟 DOM 树来高效地更新 DOM。随着 React 的发展，函数式组件和 Hooks 成为了构建组件的推荐方式，因为它们提供了更简洁和灵活的代码组织方式。

React Fiber 架构对这两者的优化

React Fiber 架构是 React 16 版本中引入的内部架构，
协调阶段（对比新旧dom）、异步渲染、任务调度、更新排队、副作用的追踪和执行、错误处理、懒加载和代码分割、内存管理、双缓冲技术、渲染中断和恢复。（后续出一篇算法细节～）
Fiber 架构的核心是对 React 的工作单元进行了重新设计，使用链表结构的 Fiber 节点代替了之前的堆栈结构，从而使得 React 能够更细粒度地控制组件的渲染过程。

作为开发者，你通常不需要直接与 Fiber 架构交互。

对 Class 组件的优化：

  1. 错误边界：Fiber 引入了改进的错误边界机制，允许类组件通过静态方法 getDerivedStateFromError 和 componentDidCatch 捕获子组件中的错误，增强了应用的稳定性。

getDerivedStateFromError 和 componentDidCatch 是 React 16.3+ 版本中引入的两个生命周期方法，它们用于错误边界（Error Boundaries）机制，允许开发者捕获组件树中抛出的 JavaScript 错误，并提供回退 UI（Fallback UI）。以下是这两个方法的详细说明：

getDerivedStateFromError（静态方法）
  • 用途：这个方法在组件抛出错误时被调用，可以返回一个对象来更新组件的状态，从而触发组件的重新渲染。
  • 使用场景：通常用于更新 UI 以反映错误状态，例如显示错误消息。
  • 参数：接收一个 error 参数，包含被抛出的错误对象。

示例：

class ErrorBoundary extends React.Component {
  constructor(props) {
    super(props);
    this.state = { hasError: false, errorMessage: '' };
  }

  static getDerivedStateFromError(error) {
    // 更新状态以触发重新渲染，并显示错误信息
    return { hasError: true, errorMessage: error.message };
  }

  render() {
    if (this.state.hasError) {
      // 渲染回退 UI
      return <h1>{this.state.errorMessage}</h1>;
    }

    return this.props.children;
  }
}
componentDidCatch
  • 用途：这个方法在类组件中捕获到子组件树中的一个错误时被调用。
  • 使用场景：用于记录错误信息、执行副作用（如发送错误报告到服务器）、更新组件状态等。
  • 参数：
    • error：包含被抛出的错误对象。
    • errorInfo：一个对象，包含有关错误位置的信息，例如组件堆栈。

示例：

class ErrorBoundary extends React.Component {
  constructor(props) {
    super(props);
    this.state = { hasError: false, errorMessage: '' };
  }

  componentDidCatch(error, errorInfo) {
    // 可以在这里记录错误信息
    console.error('Uncaught error:', error, 'Info:', errorInfo);

    // 更新状态以触发重新渲染，并显示错误信息
    this.setState({ hasError: true, errorMessage: error.message });
  }

  render() {
    if (this.state.hasError) {
      // 渲染回退 UI
      return <h1>{this.state.errorMessage}</h1>;
    }

    return this.props.children;
  }
}
共同点和差异
  • 共同点：两者都是错误边界的一部分，用于捕获子组件中的错误，并触发 UI 更新。
  • 差异：
    • getDerivedStateFromError 是静态方法，用于更新状态并触发渲染；而 componentDidCatch 是实例方法，除了可以更新状态外，还可以执行其他副作用。
    • getDerivedStateFromError 直接返回一个对象来更新状态；componentDidCatch 通过调用 setState 来更新状态。

使用建议

  • 错误边界应该仅用于捕获渲染过程中的意外错误，不应该用于捕获事件处理程序中的错误。
  • 错误边界不应该滥用，它们应该仅包裹应用中可能抛出错误的部分。
  • 使用 componentDidCatch 可以提供更多的错误处理灵活性，因为它可以访问额外的错误信息。

通过合理使用 getDerivedStateFromError 和 componentDidCatch，开发者可以提高 React 应用的健壮性，优雅地处理错误情况。

  1. 生命周期方法的改进：Fiber 支持新的生命周期方法 getDerivedStateFromProps 和 getSnapshotBeforeUpdate，这些方法提供了更细粒度的控制，并且可以与类组件的现有生命周期方法结合使用。
  2. 记忆化渲染：Fiber 允许类组件通过 shouldComponentUpdate 方法进行更有效的更新检查，减少不必要的渲染。

对函数式组件的优化：

  1. Hooks：Fiber 架构的引入为函数式组件带来了 Hooks 的支持，使得函数组件能够使用状态和其他 React 特性，如 useState、useEffect、useContext 等。
  2. 并发模式：在 React 18 中，Fiber 支持并发模式，允许函数组件利用多线程进行渲染，进一步提升性能。

通用优化：

  1. 增量渲染：Fiber 支持将渲染工作分割成小块，并分散到多个帧中，使得渲染过程更加平滑和响应。
  2. 任务优先级：Fiber 可以根据任务的优先级进行调度，确保高优先级的更新（如用户交互）优先处理。
  3. 双缓冲技术：Fiber 使用双缓冲机制，维护两个 Fiber 树——当前树和工作进度树，允许 React 在更新时随时进行比较、中断或恢复操作。

总的来说，React Fiber 为类组件和函数式组件都带来了显著的性能提升和新特性，使得开发者能够构建更高效、更稳定的 React 应用程序。

贾明恣
关注
  • 6
    点赞
  • 踩
  • 11
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
2019年前端面试题包括笔记和部分代码
12-18
这份"2019年前端面试题包括笔记和部分代码"的资源旨在帮助求职者准备面试，提升他们的竞争力。以下将详细介绍其中可能涵盖的知识点，并拓展相关领域的关键概念。 笔记部分可能会包括以下几个主要模块： 1. **HTML...
字节最新前端面试题.pdf
02-25
- ES5通过原型链和构造函数实现继承，而ES6提供class关键字，让原型链继承的写法更加直观、简洁。 8. setTimeout、Promise、Async/Await的区别： - setTimeout用于延时执行，Promise用于处理异步操作，解决回调...
2024年前端面试题汇总
sun_qqq的博客
02-08 8万+
最近面试被打击的体无完肤，于是把面试题记录下来分享一下。vue真是必问框架，八股文该背的还是得背！
想进互联网大公司？那这些题你总得会吧？前端面试题及答案
晟小明的博客
02-17 5万+
JS 数据类型 面试官：JS的数据类型都有哪些 答：数据类型分为基本数据类型和引用数据类型； 基本数据类型有： Number String Boolean null Undefined Symbol BigInt 基本数据类型是存储在栈中的。 引用数据类型有： 统称为Object类型 细分的话： Object Array Function Date RegExp 基本数据类型的数据直接存储在栈中；而引用数据类型的数据存储在堆中，在栈中保存
前端面试题汇总大全（含答案）-- 持续更新
张兴华的博客
08-07 18万+
汇总了一些前端常见的面试题。 一、HTML 篇 1. 简述一下你对 HTML 语义化的理解？ 用正确的标签做正确的事情。 html 语义化让页面的内容结构化，结构更清晰，便于对浏览器、搜索引擎解析；即使在没有样式 CSS 情况下也以一种文档格式显示，并且是容易阅读的; 搜索引擎的爬虫也依赖于 HTML 标记来确定上下文和各个关键字的权重，利于 SEO; 使阅读源代码的人对网站更容易将网站...
面试官: 说一下前端组件设计的原则
React_Community的博客
05-06 1460
前言我在最近的工作中开始使用 Vue 进行开发，但是我在上一家公司积累了三年以上 React 开发经验。虽然在两种不同的前端框架之间进行切换确实需要学习很多，但是二者之间在很多基础概念、设计思路上是相通的。其中之一就是组件设计，包括组件层次结构设计以及组件各自的职责划分。组件是大多数现代前端框架的基本概念之一，在 React 和 Vue 以及 Ember 和 Mithri...
身为三本的我就是凭借这些前端面试题拿到百度京东offer的，前端面试题及答案
热门推荐
晟小明的博客
01-18 21万+
点进来之后你的噩梦就要来了，接下来你要面对上百道面试题，那么，如果你—— 是个小白菜： 推荐使用2~3周的时间来消化接下来的面试题， 遇到不会的专业名词请立刻去搜； 文章中只是简答，如果想要详细了解的话还需要你自觉去搜索 如果你是个大神： 好叭先给您拜个早年，大哥大嫂过年好。 请温柔点黑我。 顺便，如果有错误的地方请各位一定要指出，免得误导更多人。 接下来的题我会根据重点程度使用⭐来标记，⭐越多标明越重点，满星是5颗星 ok，你准备好了吗？咱们开始吧！ JS 数据类型 面试官：JavaSc
2024前端面试题！（附答案及解析）（2024.8月最新版）
这世上从不缺让人上头的新鲜感，能顾及你情绪的人实属难得。
03-27 13万+
2024前端面试题！面试宝典！总结心得！（附答案及解析）会持续更新哦！（2024.8月最新版）感谢支持，你们的鼓励是我的动力！
2024最新前端面试真题-超详细答题思路解析（持续更新ing）
HELLO_E_SIR的博客
06-15 2066
CSS 盒模型是用来描述每个 HTML 元素在页面布局中所占空间的模型。它包括了元素的内容区域、内边距、边框和外边距四个部分。
2024前端面试题总汇（持续更新中...）
Monsters___的博客
09-26 2万+
前端面试八股文大全！！！！！
前端面试（1）——准备
乐夫天命兮的博客
08-03 2011
技术面试：问技术问题。负责人面试：考察综合能力。比如：项目把控能力、项目深度、项目架构、业务等。hr 面试：侧重于性格、沟通、潜力等。每轮面试在一小时左右。概念：职位描述：注重的是工作职责。任职要求：要求的是工作能力。通常描述得很细致。PS：前端的知识庞大，不可能所有的内容都准备好，但是要向“任职要求”靠拢。分析职位描述（JD）的目的是：快速识别出这个岗位是否是自己喜欢的、想要的。目前的技能是否能胜任岗位的要求。短期内的准备能否胜任。面试问的问题，很大层次上，取决你的简历和自我介绍。...
2019年前端面试题
03-02
在2019年的前端面试中，面试官通常会考察候选人的基础知识、技术深度、实际项目经验以及对新技术的理解和应用。以下是一些可能被问到的重要知识点： 1. HTML/CSS基础： - HTML5的新特性：如离线存储、表单控件、...
前端面试题（完整学习版）
06-16
"前端面试题（完整学习版）"这个压缩包文件，显然包含了全面的前端面试题目，旨在帮助开发者准备面试，提升自己的竞争力。以下是对这些面试题目的部分解析，涵盖了前端开发的多个关键领域： 1. **HTML**： - HTML5...
2023年最新前端程序员面试题
02-21
【前端程序员面试题】2023年的面试趋势聚焦于前端技术的深度和广度，以下是一些核心知识点的详细解释： ...这些知识点涵盖了前端开发的基础和进阶概念，对于准备前端面试的程序员来说，理解和掌握这些内容至关重要。
ASP.NET Core Web API 使用Autofac框架
鲤籽鲲的博客
08-08 628
ASP.NET Core Web API 使用Autofac框架
JAVA-WEB资源配置
最新发布
caryeko的专栏
08-15 116
用JAVA进行编写WEB项目时，我们一般需要对WEB进行统一配置，例如制定拦截路径、页面解析器、跨域配置、fastjson报文解析、文件上传大小配置等。
vue3使用pnpm运行项目但是运行不起来
一个努力不被优化的程序员
08-12 192
重新创建项目，将老项目的package.json，vite.config.ts，src等文件拖拽替换。删除node_modules重新下：文字编译乱码，utf-8可能解析处理问题。（如果哪位知道为什么会这样或者怎么解决麻烦留言下）运行项目的时候发现根本运行不起来了。删除node_modules重新下。尝试过创建.npmr文件。创建.npmr：不管用。
谷粒商城实战笔记-175~177-商城业务-检索服务-检索查询接口开发
epitomizelu的专栏
08-13 750
搜索页面搭建完成之后，点击搜索按钮，发送参数给后台服务，后台服务根据参数从Elasticsearch中查询符合条件的数据，返回给前端。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值