Javascript 根据其他属性的值在react中动态设置属性

我正在写一个REACT应用程序来显示一些评论。 每个评论都有两个属性：喜欢和不喜欢。 我的主要组件的状态如下

state = {
    listings: [
        { key: 'key6', listingCity: 'City_Name', listingTitle: 'Restaurant_Name', likes: '3', dislikes: '1', listingBodyText: 'Review_Text' },
        { key: 'key7', listingCity: 'City_Name2', listingTitle: 'Restaurant_Name2', likes: '13', dislikes: '9', listingBodyText: 'Review_Text2' }
    ]
};

我想添加另一个属性，它类似于每个餐厅的分数，这将是喜欢和不喜欢的区别。 对于我所在州的两家餐厅， 1.喜欢-3，不喜欢-1——分数=2 2.喜欢-13，不喜欢-9——分数=4

我正在试图找出生成此分数的最佳方法。 一个选项是为每个餐厅添加另一个名为score的属性，并在状态中将其初始化为0。然后在

componentDidMount（）

hook中，计算该值。 这对于初始计算很有效，但现在每当用户喜欢/不喜欢时，我都必须调用此函数以获得更新的分数

是否有方法将状态中的属性定义为其他两个属性的差异。 在我的例子中，定义分数=喜欢-不喜欢

---

我提出这个问题的主要目的是尝试并理解针对这类问题的推荐方法

您可以为此创建单独的功能，并可以传递每个餐厅的钥匙：

const calScore = (key) => {
  const listings = (this?.state?.listings??[]).map(listing => {
     if(listing.key === key) {
       return {
           ...listing,
           score: listing?.likes - listing?.dislikes
       }
     } else {
        return {...listing}
     }
  })
  this.setState({ listings })
}

---

您可以在每次单击“喜欢/不喜欢”后调用此函数。

您可以这样做：

state.listings.map（val=>{val.score=val.likes-val.dislikes；return val；}）

@gorak-所以我会将其初始化为0，然后在组件装载期间和每次，是否更新了任何喜欢/不喜欢？您打算在哪里使用此属性？如果你已经有喜欢和不喜欢的，那么你可以直接使用它们吗？Like so

likes dislikes

？@UtsavPatel当我在最终的列表页面上显示评论时，我想根据这个评级对它们进行排序。所以我想弄清楚我是应该在飞行中做这件事，还是应该在州里储存。@Vigg你应该在飞行中做。在这个用例中，我看不到创建另一个属性有任何好处。感谢分享这个@shubham chitransh，我将把这些添加到我的喜欢/不喜欢处理程序中。