要求:
1.生成两个随机数,要求整数位1位(0-9),浮点范围需包含1-5位(0-9),如0.3、7.22356
2.根据生成的两个随机数,求和
说明:
采用vue3的写法写的,看不懂的请先学习vue3
思路
- 定义生成随机数0-9的函数
- 定义生成满足条件的随机数
- 将生成的随机数相加
具体代码如下:
<template>
<button @click="clickBtn">生成随机数</button>
<h1>随机生成的第一位数是{{ num1 }}</h1>
<h1>随机生成的第二位数是{{ num2 }}</h1>
<h1>两数之和是{{ getSum }}</h1>
</template>
<script setup>
import { ref, computed } from "vue";
let numList = ref([]);
let num1 = ref(0);
let num2 = ref(0);
const getSum = computed(() => {
// 解决精度丢失的问题,由于最多五位,则需要先乘10万
return (num1.value * 100000 + num2.value * 100000) / 100000;
});
// 随机生成0-min之间或min-max之间的数
const getRandom = (min, max) => {
if (!max) return Math.floor(Math.random() * min);
return Math.floor(Math.random() * (max - min + 1)) + min;
};
// 随机生成满足条件的数
const getNum = () => {
//小数的位数:随机生成1-5
let num = getRandom(1, 5);
// 每次在添加新的数之前重置数组,不然会把上一次生成的数也加上
numList.value = [];
// 随机生成1-5位0-9的数
for (let i = 1; i < num + 1; i++) {
numList.value.push(getRandom(10));
}
return parseFloat(getRandom(10) + "." + numList.value.join(""));
};
// 按钮点击事件
const clickBtn = () => {
num1.value = getNum();
num2.value = getNum();
};
</script>