Сортировка постов

UI MySelect

реализация двустороннего связывания. На сам select вешаем директиву v-model и передаём туда modelValue. modelValue будем принимать как пропс, поэтому сразу же создаём поле props и указываем, что мы ожидаем modelValue, где в качестве типа будет строка с каким то название (например title или body).
т.е. поле, по которому будет идти сортировка.

Так же мы будем ожидать второй props — это options
Некий массив или объект представляющий пункты выпадающего списка. По дефолту это будет пустой массив.

src\components\UI\MySelect.vue

<template>
<select v-model="modelValue" @change="changeOption">
 <option disabled value="">Выберите из списка</option>
 <option 
  v-for="option in options" 
  :key="option.value"
  :value="option.value"
 >
 {{ option.name }}
</option>
</select>

</template>
<script>
export default{
 name: 'my-select',
 props: {
  modelValue: {
   type:String
  },
  options:{
   type:Array,
   default: () =>[]
  }
 },
methods: {
 changeOption(event){
  this.$emit('update:modelValue',event.target.value)
 }
}
}
</script>
<style scoped>
</style>