封装el-input

2020-07-09  本文已影响0人  代码小王子

```<template>

    <div>

        <template>

            <el-select

                    :clearable="newOptions.clearable"

                    :disabled="newOptions.disabled"

                    :filterable="newOptions.filterable"

                    :placeholder="newOptions.placeholder"

                    :value="value"

                    @click="searchSelectBtn()"

                    @input="$emit('input', $event)"

                    @change="searchSelectBtn()"

                    class="total_width"

                    :size="newOptions.size">

                <el-option

                        :key="index"

                        :label="item[newOptions.labelKey]"

                        :value="item[newOptions.valueKey]"

                        v-for="(item, index) in options"

                ></el-option>

            </el-select>

        </template>

    </div>

</template>```

<script>

    export default {

        name:"BsdSelect",

        props:{

            bsdSelectOptions:{

                type:Object,

                default:() =>{

                    return {};

                }

            },

            value:[Number, String],

        },

        computed:{

            newOptions() {

                return Object.assign({

                    url:'',

                    labelKey:'label',

                    valueKey:'value',

                    placeholder:'请选择',

                    filterable:false,

                    disabled:false,

                    clearable:true,

                    size:'small'

                }, this.bsdSelectOptions)

}

        },

        data() {

            return {

                options:[]

}

        },

        methods:{

            getDateList() {

                this.axiosCommon.getRequest(this.newOptions.url, {})

                    .then((res) =>{

                        this.options = res.data;

                    })

            },

            searchSelectBtn(methods) {  // 按钮事件

                this.$emit('searchSelectBtn', '22222');

            },

        },

        created() {

            this.getDateList()

}

}

</script>

上一篇下一篇

猜你喜欢

热点阅读