<template>
  <div class="w-full h-[80%] flex flex-col items-center justify-center">
    <img class="w-[25%]" :src="img" alt="" />
    <div class="text-[15px] font-semibold">{{ text }}</div>
  </div>
</template>
<script setup>
  import { useI18n } from 'vue-i18n'
  import { watch } from 'vue'

  const { t } = useI18n()
  const props = defineProps({
    img: {
      type: String,
      default: '@/assets/imgs/noFoods.svg',
    },
    text: {
      type: String,
      default: '还没添加菜品哦',
    },
  })
  console.log(props)
  watch(
    () => props.text,
    (newVal, oldVal) => {
      console.log('text changed', newVal, oldVal)
    },
  )
</script>
