Fetching array parameters from queries in Nuxt.js

I am currently utilizing Nuxt.js (Version 2 of Nuxt) My page has query parameters located at

https://localhost:9000/applicant?period_manual[]=2022-10-09&period_manual[]=2022-10-19

I am in need of extracting the period_manual parameters from the query.

When attempting to retrieve the data, I encounter these issues:

console.log(this.$route.query.period_manual) //- Results in 'undefined'
console.log(this.$route.query) //- Outputs {period_manual[]: ["2022-10-16", "2022-10-25"]} 
console.log(this.$route.query.period_manual[]) //- Generates an ESLint error - Parsing error: An element access expression should take an argument

What is the optimal method for retrieving the data contained within period_manual[] from the query request?

Answer №1

Why not give this a shot?

this.$route.query['period_manual[]']

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Transforming a Standard Query into a JSON Clause Hierarchy

I am looking to create a query system for my application that can be utilized by external systems for configuring based on specific conditions. My plan is to utilize a JSON Clause tree on the backend, which will be evaluated recursively. [ "AND&quo ...

Struggling with incorporating a view using ui router

Currently, I'm working my way through the MEAN stack tutorial on Thinkster, and encountering a few challenges along the way. The initial hurdle I faced was with inline views. I attempted to use a script tag with an id of "home.html" and route it usin ...

Is there a way to automatically populate an AngularJS input field?

Attempting to automate filling out a website using JavaScript. The script below: document.getElementsByClassName('form-control')[1].value = "MYNAME"; The input text changes, but upon clicking the submit button it displays as empty. Any as ...

Tips for implementing an if else statement in ReactJS while utilizing the useEffect hook

Below is the code snippet for returning a Plotly graph. I would like to display a message or alternative layout when there is no data available for the graph, such as showing "No data available". How can I achieve this? import React, { useEffect } from ...

What is the best way to eliminate the [lang tag] from a URL in Next.js?

I am looking to eliminate either the /en or the /it from the URL without explicitly adding it. i18next seems to be doing it automatically, and I am unsure how to disable this behavior. I simply want it to happen in the background. https://i.stack.imgur.co ...

Tips for passing and receiving objects as props in Vue.js

I am currently working on passing a Product object from an API call in my parent component to the child component called SoldTickets. Here is how I have set up my parent component: <template> <section id="cart-page" class="row&q ...

When a change is made in the parent component, the local state of the child component in ReactJS is automatically updated

I'm currently facing a challenge while implementing a custom dropdown filter for a table in react. Each column has a set of dropdown values with an Apply button. To handle this, I've created a child component that takes the dropdown values and s ...

The data in the second run of the jQuery datatable does not refresh successfully

I have encountered an issue while trying to load data from the server. It works perfectly on the initial load, but upon reloading, it fails to function. Please bear with me as this is a legacy project. Even after attempting a normal call and refreshing th ...

Is NodeJS Asynchronous: Has the callback been called twice?

I'm currently working with the Async module in Node.JS to manage my asynchronous calls. However, I've encountered an issue stating "Callback already called." Could someone assist me with resolving this problem? async.each(data['results&apos ...

Choose between using Paypal or Google Checkout for your shopping cart - unfortunately, both options cannot be used

My dilemma is that I currently have a functional shopping cart that is only coded for either Paypal or Google Checkout, not both. Here is a demo of the shopping cart set up for Paypal checkout: The javascript code used in the demo can be found here: Loo ...

Parsing JSON within an HTML document

It seems like what I'm attempting to do should be straightforward, but for some reason, I can't seem to get it to work? Let's say I have the following JSON file named jsonFile.json: { "level1": "elemet1", "level2": "element2", ...

Tips for highlighting HTML syntax within JavaScript strings in Sublime Text

Is there a Sublime package available for syntax highlighting HTML within JavaScript strings specifically? (Please note that the inquiry pertains to highlighting HTML within JS strings only, not general syntax highlighting.) Currently, I am developing Ang ...

What is the method to initialize a Stripe promise without using a React component?

I have encountered an issue while implementing a Stripe promise in my React app. The documentation suggests loading the promise outside of the component to prevent unnecessary recreations of the `Stripe` object: import {Elements} from '@stripe/react-s ...

Adding or removing items from the reactive source in a v-list with Vuetify causes the list to collapse

I'm experiencing an issue with reactivity in my Vuetify and Meteor.js setup. Whenever the number of items in a sub-group changes, the entire list collapses, which is quite frustrating since I have to navigate back through multiple levels to get to the ...

What is the best way to format a time in a 12-hour clock using JavaScript?

Is it possible to create a timer that performs an action after 12 hours? I want the timer to start at 6am and end at 6pm, lasting for exactly 12 hours. Additionally, I'm interested in converting my current 12-hour clock into a 24-hour format. I am se ...

Adding JSON data to an HTML document

Seeking guidance on how to efficiently parse and display information from a JSON file consisting of 3 objects onto a widget. Unsure of the best approach to achieve this task. Any suggestions or methods would be greatly appreciated. Widget Structure: < ...

Cross Domain Requests in Internet Explorer: Preflight not being sent

I have come across several similar discussions but none of the solutions provided have worked for me so far. Issue: In our current setup, we have three servers hosting our http-apis - two for testing and one for production. Lately, we have been deployin ...

javascript The mouseout event is triggered on an interactive iframe

Whilst navigating the controls within a virtual tour iframe, I've noticed that the jQuery mouseout event sometimes triggers. This can be quite frustrating as I have a separate function in place for the mouseout event specifically related to the iframe ...

issues with loop causing undefined values when using .push

I can't figure out why this particular piece of code is producing undefined values in the 'group' arrays: Arr = [0,0,1,0,0,1,1,0,1,0] for (j=0; j<5; j++){ for (i in Arr) { this["groupS" + j + "C" + i] = [Arr[i]] for ( ...

Are you incorporating multiple renderers into your Three.js project?

Is there a way to utilize two WebGL renderers (using Three.js) simultaneously within the browser? I attempted this by connecting each renderer object to individual 'div' elements: <div id="ThreeJS1"...> <div id="ThreeJS2"...> ...