Vue: لا يؤدي التبديل من مكون وظيفي إلى مكون غير وظيفي باستخدام v-if إلى تغيير سمة v-data- *.

إصدار

2.6.11

رابط الاستنساخ

https://codesandbox.io/embed/heuristic-brown-u7rvw؟fontsize=14&hidenavigation=1&theme=dark

خطوات التكاثر

انقر فوق خانة الاختيار.

ما هو متوقع؟

يجب أن يكون مكتوبًا "BLUE BOX" مع لون خلفية أزرق.

ما الذي يحدث بالفعل؟

مكتوب "BLUE BOX" بدون لون خلفية.

تنبع المشكلة من عدم إعادة تعيين السمة data-v- * لـ blue_block div عند التبديل إليه. لا يزال يستخدم السمة data-v- * الخاصة بـ div التابع في المكون الوظيفي. وبالتالي لا ينطبق تصميم فئة CSS.

https://imgur.com/a/gukDePJ

من المفيد التبديل من مكون وظيفي إلى عنصر آخر. على سبيل المثال ، عند إظهار مكون شريط تحميل بسيط قبل التبديل إلى مكون أكثر تعقيدًا.