<template> <view style="width: 100%;"> <u-input :value="selected" :input-align="inputAlign" :placeholder="placeholder" @click="showPick=true" type="select" /> <u-picker mode="selector" v-model="showPick" @confirm="toChange" :default-selector="[index]" :range="datalist" range-key="dispName"></u-picker> </view> </template> <script> import { getLookUpDatas, listLookUp } from '@/api/data' export default { name: 'v-select', data () { return { selected: '', datalist: [], placeholderText: '请选择', lookUp: [], index: 0, showPick: false } }, props: { disabled: { type: [Boolean, String], default: false }, inputAlign: { type: String, default:'left' }, value: [String, Number, Array], code: { type: String, required: true }, placeholder: { type: String, default: '' }, }, mounted () { if (this.code) { if (this.placeholder) { this.placeholderText = this.placeholder } getLookUpDatas({ type: this.code }).then(result => { if (result && result.status + '' === '200') { this.datalist = result.data if(this.value){ this.setVal(this.value) } } }) } }, methods: { getDataList (){ return this.datalist }, getOptionName (val) { return this.datalist.find((item) => { return item.code == val }) }, getCodeByName (dispName) { return this.datalist.find((item) => { return item.dispName == dispName }) }, resetVal(){ this.selected = '' this.index = 0 }, // 赋值 setVal(code){ let index = this.datalist.findIndex(item=>{ return item.code == code }) this.index = index this.selected = this.datalist[index].dispName }, toChange (e) { this.index = e[0] this.selected = this.datalist[this.index].dispName this.$emit('input', this.datalist[this.index].code) this.$emit('change', this.datalist[this.index].code) } } } </script> <style lang="scss" scoped> .v-select{ width: 100%; .form-input{ flex-grow: 1; } } </style>