微信小程序中的JavaScript问题

大家好，我的微信小程序的某页面中有一个循环渲染的navigator组件：

<navigator class="navigator1" wx:for="{{Xianfeng}}" wx:key="index" url="{{item.url}}" style="background-color:{{backgroundColor1}}">
      <image class="characterAva" src="{{item.img}}"></image>
       ···
      <view>{{item.name}}</view>
</navigator>

然后其中的“Xianfeng”数组长这样：

img


总共18条数据，每一个当中都有name、star、launchtime、img、url 5个字段
我想实现当其中的star分别为6、5、4等时改变backgroundColor1的值的功能
请问我的代码有什么问题：

data: {  //页面的初始数据
    backgroundColor1: "",
    Xianfeng: [] 
  },
  onLoad(options) {
    this.getCharacterData();  //页面加载时触发获取数据的函数
  },
  getCharacterData: function () {  //从云储存获取Xianfeng数组的数据
    wx.cloud.init({
      env: 'cloud1-9gz4etsv445a38t360'
    })
    const db = wx.cloud.database()
    db.collection('xianfeng').get({
      success: (res) => {
        console.log(res.data);
        const Xianfeng = res.data;
        this.setBackgroundColor(Xianfeng)  //成功后触发改变背景颜色的函数
        this.setData({
          Xianfeng: Xianfeng  //将获取到的数据储存到Xianfeng数组
        })
      }
    })
  },
  setBackgroundColor(Xianfeng) {  //根据Xianfeng数组中每一项star的值改变背景颜色
    const backgroundColor1 = []; 
    for (let i = 0; i < Xianfeng.length; i++) {
      if (Xianfeng[i].star === 6) {
        backgroundColor1.push("#fdf475");
      } 
      else if (Xianfeng[i].star === 5){
        backgroundColor1.push("#ff0000")  //只写了两种star的变化情况因为这个时候代码已经没有实现我想要的效果了
      }
    }
    this.setData({
      backgroundColor1: backgroundColor1,
    });
  },

十分感谢大家的回答，ps：鄙人是相关领域的初学者和自学者，如有专业名词表述不当的情况敬请海涵

你代码的思路貌似有些问题

backgroundColor1是一个数组，样式这里应该加上索引style="background-color:{{backgroundColor1[index]}}"

或者可以换一个思路，例如你这里通过star来设置背景色，可以设置不同的class值，来赋值颜色，无需处理数据。
class修改class="navigator1 bgc_{{item.star}}"，去掉style，wxss里添加样式：

.bgc_5 {
  background-color: #ff0000;
}
.bgc_6 {
  background-color: #fdf475;
}

你得设置一个默认值 当不满足条件的时候 不然你直接取 会报错 试试我这个

getCharacterData: function () {  //从云储存获取Xianfeng数组的数据
    wx.cloud.init({
      env: 'cloud1-9gz4etsv445a38t360'
    })
    const db = wx.cloud.database()
    db.collection('xianfeng').get({
      success: (res) => {
        console.log(res.data);
        const Xianfeng = res.data;
        for (let i in Xianfeng) {
            if (Xianfeng[i]['star'] === 6) {
                Xianfeng[i]['backgroundColor1'] = "#fdf475"
            }else if (Xianfeng[i]['star'] === 5) {
                Xianfeng[i]['backgroundColor1'] = "#ff0000"
            }else {
                Xianfeng[i]['backgroundColor1'] = "默认值"    
            }
            
        }
        this.setData({
          Xianfeng: Xianfeng  //将获取到的数据储存到Xianfeng数组
        })
      }
    })
  }

思路如图, 如有帮助给个采纳谢谢

img