ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

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

2022-06-02 09:31:54  阅读:197  来源: 互联网

标签:picker index val default app let 薪资 uni


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="changeHandler=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]; let _all if(_val <= 50){ //50或以下 for (let i=_val+1;i<=_val*2;i++) { dbArray.push(i) } }else{//50以上 for (let i=_val+10;i<= _val+50 && i<=260;i+=10) { dbArray.push(i); }; } for (let i = 0; i < dbArray.length; i++) { let num = Number(index); dbArray[i] += num; dbArray[i] += "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>

 

标签:picker,index,val,default,app,let,薪资,uni
来源: https://www.cnblogs.com/LindaBlog/p/16336604.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有