小程序导航栏怎么设置右侧按钮的背景色

要设置小程序导航栏右侧按钮的背景色，可以使用`setNavigationBarColor` API接口来实现。具体步骤如下：

1. 在页面的`onLoad`生命周期函数中调用`wx.setNavigationBarColor`方法来设置导航栏颜色。示例代码如下：

Page({
  onLoad: function () {
    wx.setNavigationBarColor({
      frontColor: '#ffffff', // 前景色
      backgroundColor: '#ff0000', // 背景色
    })
  }
})

2. 在小程序的`app.json`配置文件中，将`"navigationStyle"`属性设置为`"custom"`，即可禁用小程序默认的导航栏。示例代码如下：

{
  "pages": [
    "pages/index/index"
  ],
  "window": {
    "navigationBarTitleText": "小程序标题",
    "navigationBarBackgroundColor": "#ffffff",
    "navigationBarTextStyle": "black",
    "backgroundTextStyle": "light"
  },
  "navigationStyle": "custom"
}

3. 在页面的`wxml`文件中，使用`<view>`标签来实现自定义导航栏，将右侧按钮的代码放在`<view>`标签中，并设置背景色为红色。示例代码如下：

<view class="nav">
  <view class="nav-title">小程序标题</view>
  <view class="nav-btn" style="background-color: #ff0000;"></view>
</view>

4. 在页面的`wxss`文件中，设置导航栏的样式，如导航栏高度、按钮样式等。示例代码如下：

.nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 44px;
  padding: 0 10px;
  background-color: #ffffff;
  border-bottom: 1px solid #f0f0f0;
}

.nav-title {
  font-size: 16px;
  font-weight: bold;
}

.nav-btn {
  width: 44px;
  height: 44px;
}

通过以上步骤，即可实现小程序导航栏右侧按钮的背景色设置。