We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Components lose style in transition

We use <transition> element with animate.css transitions in our applications.
While transition is happening syncfusion components lose style and shows as empty inputs.
You can find mode details in attached files (screen and source code).

Attachment: vuesftest_c98b36c2.zip

7 Replies

AB Ashokkumar Balasubramanian Syncfusion Team July 11, 2019 10:42 AM UTC

Hi Viktor Kukurudziak, 
Greetings from Syncfusion support. 
The reported problem due to apply the transition on router content. If apply the transition on router content, take some time (based in specified duration attribute value) for rendering the component and apply styles. For this case, we suggest to specifying the duration attribute value as minimum on transition element or else show the input elements on after creating the component (using display style attribute). Please check the below code block.  
<div ref="about" v-if="hasContent" class="card-body"> 
    <ejs-datepicker v-model="date" placeholder="TEST" :created="onCreated"></ejs-datepicker> 
export default { 
     data: function () { 
         return { 
     methods: { 
        onCreated: function (args) { 
            this.$refs.about.style.display = "block"; 
     beforeDestroy() { 
       this.$refs.about.style.display = "none"; 
Could you please check the above modified sample and get back to us, if you require any further assistance on this? 
Ashokkumar B. 

VK Viktor Kukurudziak July 11, 2019 01:45 PM UTC

thanks for quick response.
Basically you example works but this was sample application and i real work application we have a lot of pages with different components.
Adding this code will create a lot of mess in our code.
Also, for my experience all other component(default or 3th party) work fine with transition and don't have problem like this.
So, you send me a work around but I'm locking for a fix.
Are you our team planning to make one ?

AB Ashokkumar Balasubramanian Syncfusion Team July 16, 2019 04:04 PM UTC

Hi Viktor Kukurudziak, 
We will check the possible ways to include the fix for the reported issue with our current architecture at our end. So, we suggest you use the provided work around solution in the previous update to get rid of the reported issue. 
Ashokkumar B. 

VK Viktor Kukurudziak July 17, 2019 06:24 AM UTC

great to hear that.
Let me know when it's done.
Meanwhile i will use the fix you give me.
Thanks for your help.

AB Ashokkumar Balasubramanian Syncfusion Team July 17, 2019 07:29 AM UTC

Hi Viktor Kukurudziak, 
Most Welcome. 
Please let us know, if you need any further assistance. 
Ashokkumar B.  

VK Viktor Kukurudziak October 16, 2019 12:54 PM UTC

Do you have any updates on this issue ?

GA Gurunathan A Syncfusion Team October 21, 2019 01:01 PM UTC

Hi Viktor,  
Thanks for report us.  
We have considered this as a bug and will be resolved in our volume 4, 2019 release which is scheduled on mid of December, 2019.  
Please track the status of issue by using below link.  

Live Chat Icon For mobile
Up arrow icon