- 推荐学习文档
1.使用 JavaScript 原生方法生成随机数
- 在uniapp中,由于它基于Vue.js,可以直接使用 JavaScript 原生的Math.random()方法来生成随机数。
- 例如,要生成一个介于 0(包含)和 1(不包含)之间的随机数:
// 在uniapp的脚本部分(例如.vue文件的<script>标签内)
export default {
methods: {
generateRandomNumber() {
let randomNum = Math.random();
console.log(randomNum);
return randomNum;
}
}
};
- 如果要生成一个介于某个范围内的随机整数,例如介于min(包含)和max(包含)之间的随机整数,可以使用以下公式:
// 在uniapp的脚本部分(例如.vue文件的<script>标签内)
export default {
methods: {
generateRandomInt(min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min + 1))+min;
}
}
};
- 然后可以在uniapp的模板或者其他方法中调用这个函数,例如:
<template>
<view @click="generateRandomInt(1, 100)">生成1到100之间的随机整数</view>
</template>
2.使用第三方库(如lodash,可选)
- 如果项目中已经引入了lodash库,也可以使用lodash来生成随机数。lodash提供了更方便和功能丰富的随机数生成方法。
- 首先需要安装lodash库(如果未安装):
npm install lodash
- 在uniapp的脚本部分使用lodash生成随机数:
import _ from 'lodash';
export default {
methods: {
generateRandomNumberWithLodash() {
let randomNum = _.random(0, 1);
console.log(randomNum);
return randomNum;
},
generateRandomIntWithLodash(min, max) {
let randomInt = _.random(min, max);
console.log(randomInt);
return randomInt;
}
}
};
同样,可以在模板中调用这些方法来生成随机数。不过,使用lodash库会增加项目的体积,如果只是简单的随机数生成需求,使用 JavaScript 原生方法就足够了。
希望本文对你有所帮助!如果你有任何问题或建议,欢迎在评论区留言。
关注我看更多有意思的文章哦!👉👉