Javascript Can'；if/else代码块中的t样式元素正确

我有一些来自虚拟后端的数据，例如：

[
 {
  "title": "title title 0",
  "date": "22/09/2015",
  "author": "author00",
  "langs": [
   "react",
   "javascript"
   ]
 },
 {
 "title": "title 1",
 "date": "09/11/2012",
 "author": "author188",
 "langs": [
 "angular",
 "vue"
   ]
 }],

我尝试通过“langs”数组的第一个元素对其进行样式化，例如：

const posts = this.state.posts.map(post => {
      if (post.tags[0].startsWith("react")){
        post.style.backgroundColor = "red";
        }
      }

我认为“if”语句是正确的，但我不知道在代码块中尝试什么。 当我尝试登录控制台时，一切正常。 但这种情况下的许多情况取决于数组中的第一个[0]元素是什么

例如，如果第一个元素在cideblock中包含“angular”，则许多样式选项必须在红色上重新设置范围，并且当它包含“react”时，在任何情况下主导样式颜色都必须是蓝色。

---

你能给我一些建议吗？用if/else语句改变很多东西的样式的最佳解决方案是什么？

制作一个颜色图，定义代码标签的颜色，如下所示：

const colorMap = { 'react': 'red', 'angular': 'blue' };

const posts = this.state.posts.map(post => {
      const tag = post.tags[0];
      const color = colorMap[tag];
      post.style.backgroundColor = color;
});

然后像这样使用它：

const colorMap = { 'react': 'red', 'angular': 'blue' };

const posts = this.state.posts.map(post => {
      const tag = post.tags[0];
      const color = colorMap[tag];
      post.style.backgroundColor = color;
});