Customizing the input

By default the Mobsicroll Select component renders a Mobiscroll Input component. To customize this Input component, you can pass props to it using the inputProps option. Or you can change the rendered component using the inputComponent option.

<script setup>
  import { MbscSelect, MbscInput } from '@mobiscroll/vue';
  import '@mobiscroll/vue/dist/css/mobiscroll.min.css';

  const inputPrs = {
    theme: "ios",
    label: "Select City",
    labelStyle: "stacked",
    inputStyle: "box",
    placeholder: "Click to select",
  };
</script>

<template>
  <MbscSelect
    :inputComponent="MbscInput"
    :inputProps="inputPrs"
  />
</template>