basic.vue 735 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. <template>
  2. <a-select :value="selected" @change="handleChange">
  3. <a-select-option v-for="o of options" :key="o.label" :value="o.id">
  4. {{ o.label }}
  5. </a-select-option>
  6. </a-select>
  7. </template>
  8. <script>
  9. export default {
  10. name: 'BasicSelect',
  11. model: {
  12. prop: 'value',
  13. event: 'change',
  14. },
  15. props: {
  16. value: {
  17. type: String,
  18. required: true,
  19. },
  20. options: {
  21. type: Array,
  22. default: () => ([]),
  23. },
  24. },
  25. data () {
  26. return {
  27. selected: this.value || '',
  28. }
  29. },
  30. watch: {
  31. value (val) {
  32. this.selected = val
  33. },
  34. },
  35. methods: {
  36. handleChange (v) {
  37. this.selected = v
  38. this.$emit('change', v)
  39. },
  40. },
  41. }
  42. </script>
  43. <style scoped>
  44. </style>