0

我正在尝试获取使用效果的 cookie 数据，然后使用该数据，我的组件看起来像这样..

const Favourites = (props) => {
  const [isClick, setClick] = useState(false);

  const activityId = props.activityId

  useEffect(() => {
    const favourites = Cookies.get('favourites')
    if (favourites[activityId] === true) {
      setClick(true)
    }
  })

  return (
    <>
      <div className="heart">
        <Heart isClick={isClick} onClick={() => setClick(!isClick)} />
      </div>

    </>
  );
}

这就是我在 console.log(Cookies.get('favourites')) 时得到的 -

{"5edf47240dcb4713d3942e1b":true,"5edf47240dcb4713d3942e2b":true,"5fa10bd8f70458050ffe68af":true}

改变

const favourites = Cookies.get('favourites')

至

const favourites = {"5edf47240dcb4713d3942e1b":true,"5edf47240dcb4713d3942e2b":true,"5fa10bd8f70458050ffe68af":true}

产生想要的效果。

收藏夹是使用 js-cookie 存储在本地存储中的活动 ID 数组。它基本上是用户最喜欢的活动的列表，如果他们喜欢该活动并单击心形按钮，则将 activityID 存储为键并将值设置为 true

以上不起作用，如果在收藏夹数组中 activityId 为 true，则 setClick 不会设置为 true。如果我 console.log(Cookies.get('favourites')) 并将结果复制到 const favorites 那么它确实有效

4

1 回答 1

1

从您的编辑来看，console.log显示的内容实际上是string. 因此，JSON.decode对Cookies.get返回的内容进行 a 应该可以解决问题：

const favourites = JSON.decode(Cookies.get('favourites'));
于 2020-11-30T11:50:00.400 回答