hyjiacan / vue-slideout Goto Github PK
View Code? Open in Web Editor NEWA Slide-Out component for Vue.js 2/3.
Home Page: https://hyjiacan.github.io/vue-slideout/
License: MIT License
A Slide-Out component for Vue.js 2/3.
Home Page: https://hyjiacan.github.io/vue-slideout/
License: MIT License
I cannot resize the slideout on the touchscreen
<slideout :visible.sync="slideouts.active" :dock="side" :size="size" :min-size="400" :append-to="slideParent" :showMask="false" :fullscreen="fullscreen" v-on:close="onSlideoutClosing" allow-resize @resize="resize">
可以直接引入js吗?
[Vue warn]: Failed to resolve directive: scroll-lock
(found in )
hi
i cant see the demo exmaples
Hi
Currently it's possible to use this component using nuxt plugins with client mode,
but when using it in SSR it throws error about HTMLElement is not defined
can you make it SSR compatible ?
Hi !
Thanks for your work
Can you make this use transform and will-change property instead for smoother animation ?
It will help with the lag on low end mobile devices
Do you have any plans to support Vue3 in the near future? This looks like a good project, but I want to make sure it will be forward compatible. Thanks for your hard work!
demo页面:https://hyjiacan.github.io/vue-slideout/
Top Right Bottom Left四个方向第一次打开,面板不是以滑动动画进入可视区域,而是以淡入效果进入可是区域。关闭再打开动画正常,便是滑动进入可是区域的。
https://github.com/hyjiacan/vue-slideout/blob/master/README.md?plain=1#L75
The example in the README should import the css file from 'dist' rather than 'lib'
- import '@hyjiacan/vue-slideout/lib/slideout.css'
+ import '@hyjiacan/vue-slideout/dist/slideout.css'
I'm a novice and I'm not sure how I could explain this in a reproducible way, but I figured it was worth asking anyway since I'm desperate. The component is working perfectly on the view/route that I have it on, but when I click to navigate to a different route, I get a fatal JavaScript error: Uncaught (in promise) TypeError: this._removeKeyboardEvent is not a function at Proxy.beforeUnmount (slideout.common.js:3555)
Has anyone else gotten this and figured out how to get around it? Am I missing some event handler?
I realize that it could be (and probably is) a problem with my app, but I thought I'd ask anyway in case it's a common error people experience. I tried adding handlers for the various events as well as a bunch of other things, but I still get it.
Thank you.
Hello there, I used the samples on the README.md to get started in my project.
Unfortunately nothing happens when I set visible to true.
No Slideout and no output in the console.
Is the sample broken or is the error on my side?
im use nuxtJS
the custom CLASS didnt work
and all my change in the new css class not good becuse the heghit in default 400px and cant chnage that :/
In one of my website where I have to support both web and mobile, for example, I would like to use this way:
size: 600px
max-size: 100%
So that the slide out does not overflow when the screen is small.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.