是否可以根据徽章文本更改徽章颜色？

Question

有没有办法根据文本更改徽章颜色？示例：如果我的扩展阻止了 20 个东西，它可能是黄色的，如果它阻止了 50 个东西，它可能是红色的。

Answer 1

是的，您可以根据其中的值更改徽章的颜色。
由于您正在设置徽章的值，因此您已经有了该值，您可以动态确定要使用的颜色。

之后，您可以使用browserAction.setBadgeBackgroundColor设置颜色。

// First, define badge colors with the minimum threshold.  
// For the sake of simplicity, keep the minimums in order.
const badge_colors = [
    {min: 0, color:  [255, 255, 0, 255] },
    {min: 11, color:  [255, 255, 0, 255] },
    {min: 200, color:  [255, 255, 0, 255] }
];

const badge_counter = 34; // This should already be avaliable, but can also be fetched using browserAction.getBadgeText()


const new_badge_color = badge_colors.reverse() // Reverse the list so the min is in descending order
                                .find(color=>color.min < badge_counter) // Find the first minimum value that is less than the badge counter.

// new_badge_color is now 
// {min: 11, color:  [255, 255, 0, 255] }

获得新颜色后，您可以使用 setBadgeBackgroundColor

设置颜色