Vue3 Script Setup: Converting a Component for Improved Readability and Performance

<script setup>
import { defineProps, computed } from 'vue';

const props = defineProps({
  item: {
    type: Object,
    required: true,
  },
  parentRoute: {
    type: String,
    default: '',
  },
});

const route = computed(() => {
  if (props.parentRoute) {
    return `${props.parentRoute}/${props.item.route}`;
  } else {
    return props.item.route;
  }
});
</script>