Question

我正在开发一个“喜欢”按钮，目前每次点击“喜欢”按钮，喜欢会增加1。但是，我想使其更加健壮和动态，如果登录的用户已经喜欢过某个帖子，那么我希望他们的“喜欢”消失在Facebook，Reddit（upvote）等网站上。

目前，我正在跟踪关注人数和喜欢帖子的人。结构如下：

post: {
  likes: 3,
  likedBy: ['userA', 'userB', 'userC']
}

所以我想发生的事情是：单击“喜欢”按钮时，我想搜索“ likelyBy”属性以查看登录用户是否已经喜欢该帖子，然后将“喜欢”增加1，然后将其添加到数组，或减1，然后将其从数组中删除。

我很难弄清楚如何使用处理与Firestore交互的React动作编写此逻辑。

这是我到目前为止所写的内容：

export const newLike = (post) => {
  return (dispatch, getState, {getFirebase, getFirestore})  => {
    const firestore = getFirestore();
    const signedInUser = getState().firebase.auth;
    console.log(signedInUser)
    firestore.collection('posts').doc(post.id).update({
      likes: (post.likes + 1),
      likedBy: firestore.FieldValue.arrayUnion(signedInUser)
    }).then(()=> {
      dispatch({type: types.NEW_LIKE, post});
    }).catch((err) => {
      dispatch({ type: types.NEW_LIKE_ERROR, err});
    });
  };
};

Answer 1

在您的数据结构中，无需保留likes，因为您可以从LikedBy获取它。我不熟悉firestore api，但是下面的逻辑应该可以满足您的要求，您只需要从firestore获取日期/设置日期

  return (dispatch, getState, {getFirebase, getFirestore})  => {
    const signedInUser = getState().firebase.auth;
    const posts = ...// get current state of post, with likedBy field. Also, I assume here, that likedBy is always an array, with data or empty
    let updatedLikedBy;
    if(posts.likedBy.indexOf(signedInUser) ===-1){ //assuming that signedInUser is a string
      updatedLikedBy = [...post.likedBy, signedInUser]
    } else {
      updatedLikedBy = post.likedBy.filter(item=>item!==signedInUser)
    }

    const updatedPost = {likedBy: updatedLikedBy} // now you can send this to firestore, and fire actions after success or fail.
  };
};

要立即获取likes，您只需要做posts.likedBy.length

检查元素在Firestore数组中是否存在，是否存在，运行函数以及是否不添加元素的最佳方法是什么？

1 个答案: