# فارغ Empty
عرض حالة احتياطية عند غياب البيانات. يمكن وضع أزرار العمليات في الفتحة الافتراضية، أو تمرير عنوان صورة لاستبدال الرسم التوضيحي الافتراضي.
حالة فارغة
<template>
<div class="demo-col">
<LhEmpty description="لا توجد سجلات لوحات بعد" />
<LhEmpty>
<template #default>
<LhButton type="primary" @click="reload">إعادة التحميل</LhButton>
</template>
</LhEmpty>
<p class="demo-note">عند عدم تمرير description يُؤخذ النص الافتراضي من حزمة اللغة؛ وفي الأسفل مثال على صورة مخصصة.</p>
<LhEmpty
description="عنوان صورة مخصص"
image="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='160'%20height='120'%3E%3Crect%20width='160'%20height='120'%20fill='%23e8e2d5'/%3E%3Cpath%20d='M0%2086%20Q40%2060%2080%2086%20T160%2086%20V120%20H0%20Z'%20fill='%23c9c2b2'/%3E%3Ctext%20x='50%'%20y='50'%20font-size='16'%20fill='%232b4c7c'%20text-anchor='middle'%20font-family='serif'%3E%E6%B0%B4%E5%A2%A8%E7%95%99%E7%99%BD%3C/text%3E%3C/svg%3E"
/>
</div>
</template>
<script>
export default {
methods: {
reload() {
alert('تجريبي: تشغيل إعادة التحميل')
},
},
}
</script>
# Props
| خاصية | الوصف | النوع | الافتراضي |
|---|---|---|---|
| description | نص وصف الحالة الفارغة (عند عدم تمريره يُؤخذ من حزمة اللغة empty.description) | string | — |
| image | عنوان صورة مخصص (بديل عن الرسم التوضيحي المضمّن الافتراضي) | string | — |
| sx | خصائص التخطيط السريع sx | — | — |
# Slots
الفتحة الافتراضية: منطقة العمليات أسفل الوصف (مثل زر «إعادة التحميل»).
Copyright © 2024-2026 FengMo WenXue