Skip to content
Advertisement

Tag: nuxt.js

Error when trying to target and add classes to html, body, and __nuxt elements in Vue/Nuxt

I’m getting the error “cannot read property ‘classList’ of null” when trying to add/remove classes using document.getElementsByTagName(‘html’).classList, and also for any other high-level elements in the skies above Component Land, such as body or __nuxt. Running in mounted() lifecycle with nextTick function. Also tried checking process.client, but no luck either. Any ideas? Thanks : ) Answer From my comment above,

Vue/Nuxt/Vuex – [NUXT:SSR] [ERROR] [vuex] unknown getter

The error appears when I use a v-for loop to go through the ‘allPosts’ data on my div. The Nuxt documentation says ‘Modules: every .js file inside the store directory is transformed as a namespaced module’. Maybe I’m missing something in this regard? pages/index.vue store/index.js store/posts.js Answer You have a number of issues in how you are setting up and

how to access “this” in props validator

I’m working on a project using nuxt.js, I’m injecting a function in the context of the application as recommended in the official documentation https://nuxtjs.org/guide/plugins/#inject-in-root-amp-context but when I try to call the function inside a props validation I get an error /plugins/check-props.js in a component vue ERROR: Cannot read property ‘$checkProps’ of undefined Does anyone know how I can access “this”

Iterating over keys instead of values Vue app

I’m trying to select the values for three keys from my api with axios. Each time I make a request I’m displaying the values four times for each key. I dropped a key from my data models and I re tested. When I did that my request displayed three times instead of four. Meaning I’m iterating over the keys instead

How to Run a Python Script from a Nuxt.js SPA?

I am currently working on a Nuxt.JS SPA. One of the feature is uploading, downloading, and deleting files from a cloud storage. I’ve already successfully done so using Google’s Firebase products and API because google has it in Node.JS. Now I have to change the storage to a Ceph storage. The issue is, I have to do this using Ceph’s

How to make Nuxt global object?

I want to create custom object that could be available globally in every place (plugins, middleware, component’s created/computed/mounted methods) I could access global object with context property (custom plugin, custom router middleware … ), but how to access it in component’s created() ? Answer You can use the store to for global variables: 📄 https://nuxtjs.org/guide/vuex-store 1/ Create store: 2/ Read

How can I create a custom loading indicator in Nuxt.js?

Inside this page (https://nuxtjs.org/api/configuration-loading-indicator#custom-indicators) says that I can create a custom loading indicator but not says how. Somebody can help me – how to create and set this into to nuxt.config? Answer Here is a collection of default loading indicators in Nuxt.js source code. Basically, you can specify the HTML template to use as a loadingIndicator in nuxt.config.js. Note, that

Access LocalStorage in Middleware – NuxtJs

Well, I’m starting with nuxt and I have following routes: I want to protect the /dashboard, but only for users logged in with a token in localStorage. The simplest way I thought of doing this was by creating a /middleware/auth.js and registering it in the /dashboard/index.vue component. But I cannot access localStorage within a middleware, because LocalStorage is client-side. I

Using tawk.to with Nuxt/Vue Application

Does anyone know how to use tawk.to in a Nuxt application? I created a file “tawk.js” on my plugin folder with the following code: And I put it on nuxt.config.js as well: It didn’t work. It does show some compiled errors: Answer You could try to use a vue wrapper for tawk. vue-tawk

How to get route url params in a page in Nuxt2 and 3?

I am using Nuxt.js, and have a dymanic page which is defined under So, when I visit the page url, say, http://localhost:3000/post/hello-world, how can I read this slug parameter value inside my page. Currently I am geting it using asyncData as follows: This is working fine, but I think this is not the best way, and there should be a

Advertisement