首先，确保你已经安装了Vant3组件库。你可以使用npm或者yarn进行安装：
npm install vant@next
# 或者
yarn add vant@next
然后，在你的Vue组件中引入并注册Slider组件：
<template>
<div>
<van-slider v-model="sliderValue" />
<p>当前值: {{ sliderValue }}</p>
</div>
</template>
<script>
import { ref } from 'vue';
import { Slider } from 'vant';
export default {
components: {
[Slider.name]: Slider,
},
setup() {
const sliderValue = ref(50);
return {
sliderValue,
};
},
};
</script>
在上述例子中，我们使用Vue 3的ref函数创建一个响应式的sliderValue变量，用于存储用户选择的滑块值。然后，我们在模板中使用<van-slider>标签引入了Vant3的Slider组件，并通过v-model将sliderValue与滑块的值进行绑定。
通过上述设置，用户在滑块上进行滑动时，sliderValue变量会自动更新，从而获取用户选择的滑块值。你可以根据需要调整<van-slider>组件的其他属性，例如min、max、step等，以满足实际需求。
请确保你的项目已正确配置Vant3，并根据你的实际需求调整代码。
转载请注明出处：http://www.pingtaimeng.com/article/detail/5729/Vant