uni-app实现薪资区间范围选择

templete:

<uni-forms-item label="期望薪资" name="intention_salary" class="salary_input">
                            <u--input v-model="checkVal" placeholder="请选择(选填)" readonly border="bottom"
                                placeholderStyle="color:#999;font-size:13px;" clearable @tap="pickerShow=true">
                            </u--input>
                            <u-picker class="language_picker" :show="pickerShow" ref="uPicker" :columns="columns"
                                @confirm="confirm" @change="changeHandler" @cancel="pickerShow=false;"> </u-picker> <u-icon name="arrow-right" icon="#999" size="15"></u-icon> </uni-forms-item>

js:

<script>
export default {
data() {
            return {

pickerShow:false,

columns: [ [], [] ], // 薪资第一列  columnData: [ [], [] ], // 薪资第二列 checkVal: '', // 当前选择的薪资 } }, methods:{

　

/* change薪资 */
            changeHandler(e) {
                const {
                    columnIndex,
                    index,
                    // 微信小程序无法将picker实例传出来，只能通过ref操作
                    picker = this.$refs.uPicker
                } = e;
                // console.log('选择:', e);
                switch (index) {
                    case 0:
                        picker.setColumnValues(1, e.value);
                        break;
                    default:
                        let dbArray = [];
                        let _val = e.indexs[0];
                         if(_val <= 50){ //50或以下
                             for (let k=_val+1;k<=_val*2;k++) {
                                 dbArray.push(k+'K');
                             }
                        
                         }else{//50以上
                             for (let j=_val+10;j<= _val+50 && j<=260;j+=10) {
                                dbArray.push(j+'K');
                             };
                         }
                        picker.setColumnValues(1, dbArray);
                        break;
                }
            },

 

, // 确定薪资  confirm(e) { this.pickerShow = false; let _result = e.value[0] + '-' + e.value[1]; if (e.value[0] == '面议') { _result = e.value[0]; } this.signUpformData_intention.intention_salary = this.checkVal = _result; // console.log('_result', _result);  }, } } </script>

 

实现效果：