基于 Vue 制作一个猜拳小游戏

前言：

在工作学习之余玩一会游戏既能带来快乐，还能缓解生活压力，跟随此文一起制作一个小游戏吧。

描述：
石头剪子布，是一种猜拳游戏。起源于中国，然后传到日本、朝鲜等地，随着亚欧贸易的不断发展它传到了欧洲，到了近现代逐渐风靡世界。简单明了的规则，使得石头剪子布没有任何规则漏洞可钻，单次玩法比拼运气，多回合玩法比拼心理博弈，使得石头剪子布这个古老的游戏同时用于“意外”与“技术”两种特性，深受世界人民喜爱。
游戏规则：石头打剪刀，布包石头，剪刀剪布。
现在，需要你写一个程序来判断石头剪子布游戏的结果。

---

项目效果展示：

---

对应素材：

---

---

---

---

代码实现思路：

1. 准备对应的素材用于界面效果展示。

2. 在盒子中上面设置两个 img 标签，src 用动态展示，左侧代表玩家，右侧代表电脑。

3. 在JS中设置定时器，每隔0.1秒切换背景图，达到一个闪烁的效果。
   

4. 给代表玩家的image动态赋值加载中的动画，同时在页面下方实现选择的区域，让用户能够点击。

5. 实现图片的点击事件，当点击时修改上方代表玩家图片的src值，同时停止右侧代表电脑的图片的闪烁，并通过下标判断电脑的选择。

6. 在给玩家图片赋值的同时，停止电脑方图片的闪烁，获取其src，判断哪方获胜并在页面进行显示。

7. 在页面底部实现再来一次按钮，点击时将页面数据进行重置。

---

实现代码：

---

总结：

最后还请大家帮我点击一下，谢谢大家的帮助

我正在参加 2022年「博客之星」年度总评选，请大家帮我支持一下，给我一个五星。
|
点击前往我的评选页面：
|

大家只要按图给我五星即可，谢谢大家的帮助。

---

以上就是 基于 Vue 制作一个猜拳小游戏，不懂得也可以在评论区里问我或私聊我询问，以后会持续发布一些新的功能，敬请关注。
我的其他文章：https://blog.csdn.net/weixin_62897746?type=blog