小编You*_*Zhu的帖子

我有一个使用类实例作为上下文值的上下文。在我更新了类实例之后。这种变化不会反映在消费者身上。消费者仍然可以获得旧类别的价值。有人可以指出我如何实现这一目标的方向吗？

// Service class
class Service {
   name = "oldName"
   function changeName(newName){
       this.name = newName;
   }
}

//Context provider
function App() {
  const service = new Service();
  return (
    <ServiceContext.Provider value={service}>
      <Home />
    </ServiceContext.Provider>
  );
}

然后我尝试在一个组件中更改此服务的名称属性。

import React, { useContext } from "react";

const SomeComponent = () => {
  const service = useContext(ServiceContext);
  const onClick = () => {
    service.changeName('newName')
    console.log(service.name) //here the name has updated
  }
  return <button onClick={onClick}>Change</h1>;
};

并尝试从组件中获取更新后的值。

import React, { useContext } from "react"; …