I am working in Vue to build a series of cards that scroll across a mobile screen in the x-direction. It’s sort of like a testimonial section where the user can scroll right or left to see new testimonials. I am able to apply a left margin to the cards however I can’t add a right margin to the final
Tag: vue.js
listout all the files of a folder to the right side of a container using vuejs
In my application, i have list of folders and each containing some files. I have to display those files while choosing particular folder. Those folder will be in left side.While selecting that folder, files will be listed out in right side. my json is like this: So if i choose ‘Animals’ folder then two files will be listed out in
How to set the value of a background Image in Vue using a URL generated by an API
I am trying to set the value of the background image of my #app element in Vue to the response that is generated from Unsplash’s API. I am able to retrieve the image URL, but I am having some difficulty in trying to relay that information to the background style element. Overall, my goal is to use a random image
Validating JWT Token in vue.js Router
I am using the following code to generate a JWT token: Once generated, I send the token to the client, which stores it within a cookie: Furthermore, I am using vue.js Router for my navigation. From my understanding, if one adds the following code in the router file, one can insert middle-ware in order to protect some routes. However, I
Awaiting till user finishes writing to input field in Vue.js
I have a QR code creating page. I want my QR codes to be created dynamically by user input. But I don’t want to instantly create a QR code. I want to wait my user to finish writing then after one second i will generate the QR code. So I have a template like below: And my script: Apparently the
Is it possible to use a variable across pages in VueJS (Quasar Framework)?
I am wondering if it’s possible to do something like this: And access this variable on other .vue page, like this: Thanks for your time. Answer One option will be to use local storage: Then:
Vuejs loading CSS and JS files giving MIME type error
I have created a new vue-webpack project. when I want to add CSS and js files through link and script it gives me this error The stylesheet http://localhost:8080/src/assets/styles.css was not loaded because its MIME type, “text/html”, is not “text/css”. and for js files, it gives this error Uncaught SyntaxError: expected expression, got ‘<‘ I have included them inside index.html file.
Best way toggle between three classes for an Element
I have 3 buttons, which on click would the change the layout to desktop , mobile and tab view. . So I’m calling the same method toggleView(), passing different param for different buttons. So i have written the method to toggle between the 3 classes. It’s working fine. I feel there would be a better way to do this in
Vuetify data table :item-class doesn’t do anything
I’m really confused by “:item-class” prop in Vuetify (v. 2.3.4) data table. It does nothing even if I try to add a static text class. It just renders tr tags without any class: Do you know why? I think it worked some time ago and I haven’t changed Vuetify (2) version. Answer item-class does not specify the CSS classes directly.