renderTriggered (renderTriggered)
هوک «renderTriggered در ویو (Vue)» مخصوص دیباگ است. «هوک (Hook)» یعنی زمان آماده اجرای کد. هر زمان تغییر واکنشی رندر را فعال کند، این هوک اجرا می شود. سپس صفحه تازه رندر می شود. این قابلیت فقط در حالت توسعه فعال است.
تعریف و کاربرد
renderTriggered وقتی اجرا می شود که یک کامپوننت واکنشی تغییر کند. بنابراین تابع رندر دوباره اجرا می شود. سپس صفحه با تغییرات تازه به روز می شود. این هوک برای دیباگ است و فقط در حالت توسعه کار می کند.
نمونه کد از منبع
در این نمونه، هر بار رندر فعال شد، جزئیات evt لاگ می شود.
export default {
data() {
return {
counter: 0
};
},
renderTriggered(evt) {
console.log("renderTriggered: ", evt);
alert("renderTriggered");
}
};
گام های عملی
- حالت توسعه را فعال نگه دار. دیباگ آسان تر می شود.
- هوک renderTriggered را در کامپوننت بنویس.
- evt را در کنسول ثبت کن و بررسی کن.
- علت رندر دوباره را پیدا کن و بهینه کن.
توضیح دو اصطلاح مهم
کامپوننت واکنشی: بخشی که با تغییر داده، دوباره رندر می شود.
تابع رندر: کدی که وابستگی ها را پیگیری می کند و صفحه را تازه می کند.
نکته ها و هشدارها
نکته: از alert زیاد استفاده نکن. تجربه کاربر بد می شود.
نکته: برای ردگیری وابستگی ها، از لاگ ساختاریافته بهره ببر.
هشدار: این هوک در تولید غیرفعال است. روی آن تکیه نکن.
پیوندهای مرتبط
برای ردیابی اولیه وابستگی ها، صفحه renderTracked را ببین. همچنین برای خطاها به errorCaptured مراجعه کن. برای مرور کامل چرخه، به unmounted هم سر بزن.
جمع بندی سریع
- renderTriggered با تغییر واکنشی اجرا می شود.
- فقط در حالت توسعه فعال است.
- evt را برای دیباگ بررسی کن.
- از alert زیاد استفاده نکن.
- برای آغاز ردیابی، renderTracked را ببین.