外观
range 数值范围限制
约 219 字小于 1 分钟
2024-01-01
介绍
将数值限制在指定的范围内,确保数值不会超出最小和最大值。
range(min: number, max: number, value: number): number
- 参数
- min: 最小值,默认 0
- max: 最大值,默认 0
- value: 要限制的数值,默认 0
- 返回值
<Number>限制在范围内的数值
示例代码
<template>
<view>
<text>数值范围限制</text>
<slider v-model="inputValue" :min="1" :max="100" show-value />
<view>
<text>原始值: {{ inputValue }}</text>
<text>限制在10-50范围: {{ rangeValue }}</text>
</view>
</view>
</template>
<script setup lang="uts">
import { ref, computed } from 'vue'
import { range } from '@/uni_modules/uview-unix'
const inputValue = ref(50)
// 使用计算属性实时计算范围限制后的值
const rangeValue = computed(() => {
return range(10, 50, inputValue.value)
})
// 示例使用
console.log('range(10, 50, 60):', range(10, 50, 60)) // 50
console.log('range(10, 50, 5):', range(10, 50, 5)) // 10
console.log('range(10, 50, 30):', range(10, 50, 30)) // 30
</script>