流星随机选色器

我写了这个函数，它应该从这个数组中显示一个随机颜色，但它总是显示第一个。我的代码有问题吗？我曾尝试使用谷歌搜索并检查流星文档，但没有发现任何用处。流星随机选色器

randomInitials: function() { 
    var chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'; 
    var nLetter = chars.charAt(Math.floor(Math.random()*chars.length)); 
    var sLetter = chars.charAt(Math.floor(Math.random()*chars.length)); 
    var colors = ["#e57373","#f06292","#ba68c8","#9575cd","#7986cb","#64b5f6","#4fc3f7","#4dd0e1","#4db6ac","#81c784","#aed581","#dce775","#fff176","#ffd54f","#ffb74d","#ff8a65","#a1887f","#e0e0e0","#90a4ae"]; 

    return colors[Math.floor(Math.random()*colors.length)]; 
    return nLetter + sLetter; 
},

<div class="other-profile"> 
    <span>{{memberData.profile.initials}}</span> 
</div>

现在它看起来是这样的：

我想这一点：

来源

2016-11-15 weinde

两个return语句是一个问题本身，'返回nLetter + sLetter;'永远不会被击中。随机颜色选择器似乎工作正常：https：//jsfiddle.net/a3Lq7xtv/。是什么让你觉得有问题？ –

@RoryMcCrossan你有什么建议呢？ – weinde

@RoryMcCrossan问题是每个用户圈子的背景都以相同的颜色显示，而不是随机的颜色......我将张贴一张图片，以便您明白我的意思 – weinde

既然你只需要返回的颜色，你的帮手需要看起来像

randomInitials: function() { 
    var colors = ["#e57373","#f06292","#ba68c8","#9575cd","#7986cb","#64b5f6","#4fc3f7","#4dd0e1","#4db6ac","#81c784","#aed581","#dce775","#fff176","#ffd54f","#ffb74d","#ff8a65","#a1887f","#e0e0e0","#90a4ae"]; 
    return colors[Math.floor(Math.random()*colors.length)]; 
},

而且在你的模板：

<div class="other-profile" style="background-color: {{randomInitials}}"> 
    <span>{{memberData.profile.initials}}</span> 
</div>

来源

2016-11-16 04:19:52 Monasha

流星随机选色器

回答

相关问题