Question

我尝试重新创建喜欢/不喜欢的youtube栏，其中填充了2种不同的颜色，表示相互比较的喜欢和不喜欢的数量并相应地填充颜色。所以我有我喜欢或不喜欢的Product模型：

.vote-bar
  .bar
    .likes{style: "width: #{@product.get_likes.size}%"}
    .dislikes{style: "width: #{@product.get_dislikes.size}%"}

我使用Acts As Votable gem给了我一些产品的喜欢和不喜欢的东西。我在如何根据100％获得每个百分比方面遇到麻烦。所以，如果我有1喜欢它应该填满整个酒吧，如果我有0不喜欢它应该什么都不填。另一个例子是2％喜欢= 2％的酒吧和3％的不喜欢= 3％的酒吧。两个div虽然总共应该只能达到100％。我该怎么做？

Answer 1

要获得百分比，您需要将每个值除以总投票数。您可以将这些方法添加到产品模型中：

class Product
  def percentage_likes
    self.get_likes.size.to_f / self.votes_for.size * 100
  end

  def percentage_dislikes
    self.get_dislikes.size.to_f / self.votes_for.size * 100
  end
end

请注意，我已将喜欢和不喜欢的大小转换为浮点数，因为整数除以整数将返回另一个整数。另外，我乘以100，以便将分数转换为百分比。

您的观点将如下所示：

.vote-bar
  .bar
    .likes{style: "width: #{@product.percentage_likes}%"}
    .dislikes{style: "width: #{@product.percentage_dislikes}%"}

你可能需要做一些额外的CSS操作来浮动.likes和.dislikes div，这样它们就会并排出现。

如何根据喜欢和不喜欢的百分比来填充酒吧？

1 个答案: