How to build a range slider with select box in Vue?

Hi I am new in Vue and I have a project that uses Vue, PHP and Laravel. price rangepicture link

I have to build a price filter like the picture. But I have no idea to code the select box that value will change when moving slide. Anyone has successed in doing this?

What I did until now.

    <template>
          <div class="col-12 col-lg-7 pb-2 pl-5"> 
            <div class="row align-items-baseline">
                <div class="col-3 col-lg-3 text-navy font-weight-bold">
                    予算
                </div>
                <vue-slider
                    ref="slider"
                    v-model="slider_value" :enable-cross="false"
                    :dot-size="dotSize"
                    :dot-style="dotStyle"
                    :rail-style="railStyle"
                    :process-style="processStyle"
                    :min="0"
                    :max="100"
                    :tooltip="false"
                    class="col-7 col-lg-7 pl-lg-1"
                ></vue-slider>
            </div>
                <!-- ID Example -->
            <div class="row align-items-baseline ml-lg-3">
                <div class="col-5 col-lg-5 px-1 inputSelectWrap">
                    <select name="">
                        <option>下限なし</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                    </select>
                </div>
                <div class="text-center px-1">～</div>
                <div class="col-5 col-lg-5 px-1 inputSelectWrap">
                    <select name="">
                        <option>上限なし</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                    </select>
                </div>
            </div>
        </div>
    </template>

<script>
// import component
import VueSlider from 'vue-slider-component/dist-css/vue-slider-component.umd.min.js'
import 'vue-slider-component/dist-css/vue-slider-component.css'

// import theme
import 'vue-slider-component/theme/default.css'
export default {
    components: {
       'vueSlider': VueSlider,
    },
    data: () => ({
        slider_value: [0, 100],
        dotStyle: {
            backgroundColor:"#fff",
            borderColor:"#fff",
        },
        processStyle: {
            backgroundColor: "#1d3557",
        },
    }),