New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
problems with reSlick #45
Comments
Did you try to use Vue.nextTick as in readme? |
Im trying to use it with the following code but it removes all the html code created with v-for.
|
Same problem here... |
Hi guys, did someone manage to get this working? Still having the problem too. template:
script:
And it does not update it. Any idea? ====================
Basically, the function reSlick is doing Destroy() and Create(), but it is not waiting for the nextTick(). Here, I add a word each 2 seconds and I watch the property "words". On this change, I destroy the current carousel, and create it again after one tick. Obviously the index goes back to 0 so I store it beforehand. Perhaps there is a simpler solution, but it's the only thing I managed to do to make this work, hope this helps ! |
yes i have fixed my problem and got it working. |
@iwebnaut please can you place your solution here? |
yes of course, what I did I got of my lazy ass and implemented my own slider that matches any feature slick had to begin with and then added more features to it, it took few weeks but I got 100% vue based kick ass slider now :) |
same error |
the best way is creating your own slide component for Vue.js Read Wrapper Componnent |
as I mentioned above I created my own, its not hard to do. Check the results here https://www.youtube.com/watch?v=Mg_eG9H3zLM it entirly vuejs based and no wrappers where needed |
reSlick is currently broken staskjs/vue-slick#45 So this works around the issue by destroying and recreating the slick instance when the items change.
@nikocraft good job on making your own :) any chance of making it open-source and adding it to github so we can all benefit from it ;) |
@vesper8 its a part of the CMS I am making, I can't easily extract it. CMS should be released next year but that will not help you right now, sorry :) |
Worked to me. I used like this: Component:
And inside my js:
|
Also I had multiple slideshows (of which I was showing one at a time depending on one prop), so I had to assign different refs and to do the same thing for every ref |
I found this did the trick. Destroy and recreate using the lifecycle hooks.
|
I am using v-for loop to render slides and when I add new slide I run reSlick
it works fine on static content with no v-for, for example this works:
I run reSlick on that and it does not mess up the slides, however if I have a v-for where I can dinamically insert slides then I get a problem
example:
template:
watch:
As soon as I add second slide manually throught user interface of my app, the html code that is output should be two slides, it should output only slide component template:
however after reSlick is run, it "swallows" all html code but of the last slide added. So I can't reinitialize slides after i add new slide, all old slides get removed from html and latest one is inserted.
This does not happen if reSlick is not run after I manually add a slide.
The text was updated successfully, but these errors were encountered: