答题小程序学习，题库答题类小程序，云开发+cms做后台，有错题集，积分排名

最后

为什么我不完全主张自学？
①平台上的大牛基本上都有很多年的工作经验了，你有没有想过之前行业的门槛是什么样的，现在行业门槛是什么样的？以前企业对于程序员能力要求没有这么高，甚至十多年前你只要会写个“Hello World”，你都可以入门这个行业，所以以前要入门是完全可以入门的。
②现在也有一些优秀的年轻大牛，他们或许也是自学成才，但是他们一定是具备优秀的学习能力，优秀的自我管理能力（时间管理，静心坚持等方面）以及善于发现问题并总结问题。
如果说你认为你的目标十分明确，能做到第②点所说的几个点，以目前的市场来看，你才真正的适合去自学。

除此之外，对于绝大部分人来说，报班一定是最好的一种快速成长的方式。但是有个问题，现在市场上的培训机构质量参差不齐，如果你没有找准一个好的培训班，完全是浪费精力，时间以及金钱，这个需要自己去甄别选择。

我个人建议线上比线下的性价比更高，线下培训价格基本上没2W是下不来的，线上教育现在比较成熟了，此次疫情期间，学生基本上都感受过线上的学习模式。相比线下而言，线上的优势以我的了解主要是以下几个方面：
①价格：线上的价格基本上是线下的一半；
②老师：相对而言线上教育的师资力量比线下更强大也更加丰富，资源更好协调；
③时间：学习时间相对而言更自由，不用裸辞学习，适合边学边工作，降低生活压力；
④课程：从课程内容来说，确实要比线下讲的更加深入。

应该学哪些技术才能达到企业的要求？（下图总结）

本文已被CODING开源项目：【一线大厂Java面试题解析+核心总结学习笔记+最新讲解视频+实战项目源码】收录

需要这份系统化的资料的朋友，可以点击这里获取

3-2，笔记电子书

笔记我也有整理一套电子书，大家也可以私聊石头哥获取电子书版的配套笔记。电子书笔记方便后期查询知识点，当然也要拿米来换。

3-3，配置源码和资料

配套源码和资料需要拿米来换，或者成为石头哥的解答会员也可以获取。

4，问题解答(●’◡’●)

---

另外石头哥提供配套解答服务。当然了，知识付费时代石头哥解答是要米的，毕竟石头哥精力有限，石头哥也是要吃面包的。石头哥有推出包月，包年解答服务。你在学习过程中有任何问题，或者工作中遇到任何编程问题，都可以来找石头哥

石头哥目前可以解答如下问题

• 小程序方面的问题

• 云开发方面的问题

• Java，springboot，Javaweb方面的问题

• 毕设方面的问题

• 安卓app开发方面的问题

• html+css+JavaScript方面的问题

• 前端开发的问题

• 后端开发的问题

• 面试找工作方面的问题

三，项目创建

====================================================================

3-1，获取appid

---

我们获取小程序appid必须先去注册一个小程序，小程序的注册我小程序基础课里有讲过，大家可以去看下我基础课。

3-2，创建项目注意事项

---

为了保持一致，创建项目时选择使用云开发

3-3，去除项目里的无用文件

---

跟着石头哥的视频，把项目里一些无用的文件删除掉，保持代码简洁。

四，单选知识点

=====================================================================

4-1，radio和radio-group实现单选答题

---

官方文档：https://developers.weixin.qq.com/miniprogram/dev/component/radio.html

4-2，单选的wxml布局

---

<view>题目：这门课的老师是谁？</view>

<radio-group bindchange="radioChange">

  <view>

    <radio value="A" />

    <text>A:编程小石头</text>

  </view>

  <view>

    <radio value="B" />

    <text>B:疯狂小石头</text>

  </view>

  <view>

    <radio value="C" />

    <text>C:大石头</text>

  </view>

  <view>

    <radio value="D" />

    <text>D:石头王</text>

  </view>

</radio-group>



<button type="primary" bindtap="submit">提交答题</button>

效果如下：

4-3,单选的js页面如下

---

Page({

  data: {

    right: 'A',

    select: ''

  },

  //用户选择了选项

  radioChange(e) {

    let select = e.detail.value

    console.log('用户选择了', select)

    this.setData({

      select: select

    })

  },

  //提交答题

  submit() {

    console.log('正确答案是', this.data.right)

    console.log('用户选择了', this.data.select)





    //当数据为空字符串或者null的时候，我们对这个数据取反

    if (!this.data.select) {

      console.log('执行了if')

      wx.showToast({

        icon: 'none',

        title: '你还没有选择呢',

      })

    } else if (this.data.right == this.data.select) {

      wx.showToast({

        title: '您答对啦',

      })

    } else {

      wx.showToast({

        icon: 'none',

        title: '您答错啦',

      })

    }

  }

})

五，多选知识点

=====================================================================

5-1，checkbox和checkbox-group实现多选

---

官方文档：https://developers.weixin.qq.com/miniprogram/dev/component/checkbox.html

5-2,多选wxml页面的布局

---

<view>题目：这门课的老师是谁？</view>

<checkbox-group bindchange="checkboxChange">

  <view>

    <checkbox value="A" />

    <text>A:编程小石头</text>

  </view>

  <view>

    <checkbox value="B" />

    <text>B:疯狂小石头</text>

  </view>

  <view>

    <checkbox value="C" />

    <text>C:大石头</text>

  </view>

  <view>

    <checkbox value="D" />

    <text>D:邱石</text>

  </view>

</checkbox-group>

<button bindtap="submit" type="primary">提交答题</button>

效果如下

5-3,多选的js页面

---

由于我们多选的时候有很多种打分规则，这里以两个最常见的打分规则为例。

5-3-1,规则一，全部答对才对，打错一个即为错误

Page({



  data: {

    right: ['A', 'D'],

    select: []

  },

  //获取用户选择了哪些选项

  checkboxChange(e) {

    console.log(e.detail.value)

    this.setData({

      select: e.detail.value

    })

  },

  //提交

  submit() {



    //规则一，全部答对才对，打错一个即为错误

    let arr = this.data.right

    let len = arr.length //正确答案的个数



    let arr2 = this.data.select

    let len2 = arr2.length

    console.log('正确答案', arr)

    console.log('用户选择的答案', arr2)

    if (len == len2) { //1，判断个数是否相同

      console.log('用户答题得个数和正确选项得个数相同')

      let rigthNum = 0

      arr2.forEach(item => {

        if (arr.indexOf(item) > -1) {

          rigthNum++

          console.log(item, '是正确选项')

        }

      })

      //2，计算答对的个数

      console.log('答对的个数', rigthNum)

      //3，判断答对的个数是否等于答案的个数

      if (rigthNum == len) {

        console.log('闯关成功，彻底答对啦')

        wx.showToast({

          title: '答对啦',

        })

      } else {

        console.log('答题失败')

        wx.showToast({

          icon: 'none',

          title: '答错啦',

        })

      }

    } else {

      console.log('错误，选项个数不对')

      wx.showToast({

        icon: 'none',

        title: '答错啦',

      })

    }

  }

})

5-3-2,规则二，按答对的个数给分

我这里只把核心代码贴出来给到大家，具体的还请大家去看视频讲解。

/**

   * 规则二，按答对的个数给分，比如3个答案答对一个给1分，答对3个给满分

   * 1,判断答题个数是否小于答案个数 答1，2，3才给分

   * 2，只答一个。要判断这一个是否在答案里，在的话就给1分

   * 3，答二的时候：两个都在正确答案里，给2分

   * 4，答三个的时候：三个全都在正确答案里，给3分

   */

  guize2() {

    let arr = this.data.right

    let len = arr.length //正确答案的个数



    let arr2 = this.data.select

    let len2 = arr2.length

    console.log('正确答案', arr)

    console.log('用户选择的答案', arr2)

    //第一关：答题的个数必须小于等于正确答案的个数

    if (len2 <= len) {

      console.log('答题个数小于等于正确答案，第一关闯过了')

      let rigthNum = 0

      arr2.forEach(item => {

        if (arr.indexOf(item) > -1) {

          rigthNum++

          console.log(item, '是正确选项')

        }

      })

      //第二关：用户选择的选项全部在正确答案里

      if (rigthNum == arr2.length) {

        console.log('第二关闯关成功，用户选择的选项都是对的')



        //第三关：用户答了满分

        if (rigthNum == len) {

          console.log('第三关闯关成功，用户得了满分')

          console.log("用户得分:100分")

        } else if (rigthNum < len) {

          //保留两位小数，并四舍五入    .toFixed(2)

          let defen = rigthNum / len * 100 //33.33333333333333

          defen = defen.toFixed(2)



          console.log("用户得分:", defen)

        }



      } else {

        console.log("用户得分:0分,虽然第一关闯关了，但是第二关没有闯关成功，所以0分")

      }

    } else {

      console.log('答题个数大于了正确答案，判错')

      console.log("用户得分:0分，一关都没有闯成功，你不0分谁0分")

    }



  }

六，多个题目

====================================================================

6-1，连续做多个单选题

---

我们上面的知识点每次只讲了一道题的作答，这里开始，我们就要实现多个题目的作答，然后可以记录错题，实现总体打分。

6-1-1，定义题目数据

我们这里以3个单选题为例，首先来看下数据

如上图所示，我们定义了三道选择题。我这里把数据放在配套资料的题库里了

大家只需要把题库里的‘3道单选题.txt’里的内容复制到js代码里，即可(视频是免费的，源码和资料需要拿米来换，毕竟创作不易，还望体谅)

6-1-2，编写wxml显示题目

显示效果如下

6-1-3，编写js代码的注意事项

我们在第一次进入页面时需要优先加载第一个题目

比如我这里连续做了3个题，效果图如下

接下来就在视频里详细教大家如何实现连续做题，并最终打分。所以听视频课的时候要认真了奥。

6-1-4,添加做题进度条

如下图所示，添加一个进度条，可以让用户查看当前做题进度。

这里用到了progress组件，对应的文档如下。

https://developers.weixin.qq.com/miniprogram/dev/component/progress.html

七，错题集

===================================================================

7-1，错题集效果图

---

首先来看下效果图

7-2，具体代码

---

我这里直接把具体代码贴出来给到大家吧。代码不是很多

7-2-1，wxml页面

7-2-2，js页面

7-2-3，wxss样式

八，借助云开发把题库放到数据库

=============================================================================

这一节我们就来开始把题目做成活得，做成活的就是把题库放到云端数据库。

8-1，新建项目

---

我们这一节来新建一个项目,可以参考我们前面笔记的第三章。

8-2，导入题库数据到数据库

---

8-2-1，首先创建一个数据表(集合)

8-2-2，下载题库

8-2-3，导入题库到数据表

如下图所示，点击导入

然后选择桌面下载好的question.json

等待导入完成即可

8-2-4，导入数据成功

可以看到我们对应的数据表里多了很多数据。

8-3，在页面加载数据库里的题目

---

8-3-1，首先不要忘记把数据表的权限改成下面这样

8-3-2，然后代码里编写数据请求

可以看到日志台的打印如下，并且17个题目也显示到了页面上。

详细的代码编写过程，可以跟着视频学习。

8-4，通过设置tabbar实现多页面

---

由于这段代码基本上是固定写法，所以我贴出来给到大家，大家后面再设置tabbar时，直接来笔记里复制代码即可。

 "tabBar": {

    "color": "#8a8a8a",

    "selectedColor": "#ffb965",

    "list": [{

      "pagePath": "pages/race/race",

      "text": "首页",

      "iconPath": "images/home-no.png",

      "selectedIconPath": "images/home-yes.png"

    }, {

      "pagePath": "pages/me/me",

      "text": "我的",

      "iconPath": "images/me-no.png",

      "selectedIconPath": "images/me-yes.png"

    }]

  },

九，源码的下载和项目部署

==========================================================================

最后

俗话说，好学者临池学书，不过网络时代，对于大多数的我们来说，我倒是觉得学习意识的觉醒很重要，这是开始学习的转折点，比如看到对自己方向发展有用的信息，先收藏一波是一波，比如如果你觉得我这篇文章ok，先点赞收藏一波。这样，等真的沉下心来学习，不至于被找资料分散了心神。慢慢来，先从点赞收藏做起，加油吧！

另外，给大家安排了一波学习面试资料：

以上就是本文的全部内容，希望对大家的面试有所帮助，祝大家早日升职加薪迎娶白富美走上人生巅峰！

本文已被CODING开源项目：【一线大厂Java面试题解析+核心总结学习笔记+最新讲解视频+实战项目源码】收录

需要这份系统化的资料的朋友，可以点击这里获取

ages/home-no.png",

  "selectedIconPath": "images/home-yes.png"

}, {

  "pagePath": "pages/me/me",

  "text": "我的",

  "iconPath": "images/me-no.png",

  "selectedIconPath": "images/me-yes.png"

}]

},

[]( )九，源码的下载和项目部署

==========================================================================




### 最后

俗话说，好学者临池学书，不过网络时代，对于大多数的我们来说，我倒是觉得学习意识的觉醒很重要，这是开始学习的转折点，比如看到对自己方向发展有用的信息，先收藏一波是一波，比如如果你觉得我这篇文章ok，先点赞收藏一波。这样，等真的沉下心来学习，不至于被找资料分散了心神。慢慢来，先从点赞收藏做起，加油吧！

另外，给大家安排了一波学习面试资料：

[外链图片转存中...(img-OAhqHWzP-1715699710075)]

[外链图片转存中...(img-XKcD1LOc-1715699710076)]

以上就是本文的全部内容，希望对大家的面试有所帮助，祝大家早日升职加薪迎娶白富美走上人生巅峰！

> **本文已被[CODING开源项目：【一线大厂Java面试题解析+核心总结学习笔记+最新讲解视频+实战项目源码】](https://bbs.csdn.net/forums/4f45ff00ff254613a03fab5e56a57acb)收录**

**[需要这份系统化的资料的朋友，可以点击这里获取](https://bbs.csdn.net/forums/4f45ff00ff254613a03fab5e56a57acb)**