What is the best way to extract parameters from a URL in Vue.js?

I am dealing with URLs structured like this:

http:://www.mywebsite.com/myapp?brand=nameOfBrand&user=0123456&type=comm

In order to display the logo of the respective brand based on the parameter 'nameOfBrand', for example, if I receive brand=google, I want the Google logo to be shown. The same goes for brands like Amazon and others.

Any suggestions on how I can retrieve this specific parameter?

Answer №1

var url_string = "http://www.mywebsite.com/myapp?brand=nameOfBrand&user=0123456&type=comm"; //window.location.href
var url = new URL(url_string);
var brand = url.searchParams.get("brand");
console.log(brand);

You can utilize the URL function to convert the URL string and then use the searchParams.get method to extract the specific value you need.

For additional details

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

Using PHP and JQuery to disable a button after the letter "U" is typed

I am looking for a way to disable the button when the term "U" (defined as Unable) appears. How can I achieve this? Below is the button in question: <input type="submit" class="form-control btn-warning" name="search" value="Search Data"></input& ...

Is it possible to generate a post automatically every second using an AJAX call, with no user input required?

Want to find the answer? Check out this link: Render a view in rails via AJAX and controller In my Rails application, I have a Post model that automatically creates and saves new posts while deleting old ones every 10 seconds using an AJAX call set withi ...

Issue with Vue-gtag @legacy query not retrieving customer identification ID

Currently utilizing Vue2, I opted for vue-gtag@legacy as it's tailored for compatibility with version 2 of VueJS. Here is the setup in main.ts plugin: import VueGtagPlugin from "vue-gtag"; Vue.use(VueGtagPlugin, { config: { id: "G-MY ...

searching for identical values of a given input text within an array

As a beginner, I've been searching for answers to my doubts on various websites. After reviewing my webpage source code, here's what I found: <input type="text" name="house[0].adress01" value ="10" > <input type="text" name="house[0].ad ...

Navigate to specific sections

I'm currently developing a website and working on creating a menu that allows users to smoothly scroll to anchors within the same page as well as anchors on different pages. Successfully implemented the scrolling functionality for same-page anchors u ...

What is the method of direction storage used by Three.js?

element, there is a discussion about coding a server for a new game developed by a group of friends. The question focuses on how to store the direction a player is looking at in a 3D plane efficiently. One suggestion is using an object with two variables ...

Trigger jQuery Waypoints Only Once

Utilizing , I am seeking to trigger a specific action when the user scrolls down to the section marked with the class div1. However, the action should only occur once and not repeatedly each time the user reaches that point. — just once $('.div1&ap ...

It seems that React JS with Redux may not be triggering a re-render

I am currently delving into the world of React JS with Redux and have what I believe is a straightforward query. Here's the code snippet I'm working with: import React from 'react'; import ReactDOM from 'react-dom'; import { ...

Leveraging a factory value within another factory in AngularJS

Greetings! I am currently working on a web application using AngularJS. Within my project, I have a JavaScript file containing two factories that make HTTP calls to a web API. My goal is to utilize the output of one factory within another factory. Below is ...

Display or conceal a YouTube video with a click

Q1) Is it possible to use JQuery on page load to detect the file name of an image and then dynamically position it on the page with CSS? Q2) What is the most efficient way to achieve this without embedding iframe code inside a specific div.icon element? ...

Dropping anchor whilst skipping or jumping

One of my website elements is a drop anchor that connects from a downwards arrow situated at the bottom of a full-page parallax image to another section on the same page. The HTML code snippet for the drop anchor is as follows: <section id="first" cla ...

Chapter 5 of Eloquent JavaScript's 3rd Edition presents Exercise 3

I'm struggling with an exercise in the latest edition of a book, specifically in Chapter 5 which covers Higher-Order Functions. The prompt for the exercise is as follows: "Similar to the some method, arrays also contain an every method. This method r ...

Is it possible to iterate through HTML form data using JSON arrays or objects?

I've been searching this website and the internet for a while now, trying to figure out how to save multiple arrays to my localStorage. I asked a question earlier which helped me progress a bit, but I'm still struggling to grasp the concept. I c ...

A simple method in JavaScript/TypeScript for converting abbreviations of strings into user-friendly versions for display

Let's say I am receiving data from my backend which can be one of the following: A, B, C, D Although there are actually 20 letters that could be received, and I always know it will be one of these specific letters. For example, I would like to map A ...

Unconventional way of assigning class properties in Typescript (Javascript): '?='

Recently, I came across the ?= assignment expression within a class property declaration. Can anyone provide some insight into what this means? I am familiar with the new Optional Chaining feature (object?.prop), but this particular syntax is unfamiliar t ...

Monitoring the modifications of a linked component in React: A guide

I am facing an issue where I need to store the text of a referenced element in an array. My goal is to first display the text of each paragraph element with the "ebookName" class in the console before storing it in the array. However, I have encountered a ...

Enable row selection in UI-Grid by clicking on a checkbox with AngularJS

I am a newcomer to angular js and I am looking to have the checkbox automatically selected when clicking on a row to edit that specific cell. I have implemented a cell template to display the checkbox in the UI-grid, but now, when I select a row, the row i ...

What is the best way to convert API data into a currency format?

Hello, I need assistance with formatting data retrieved from an API into a currency format. The code below successfully retrieves the data but lacks formatting. For instance, if the data displays as 100000000, I would like it to be formatted as IDR100.000. ...

Extract content from whole webpage including HTML, CSS, and JavaScript

Currently I am working on developing a webpage version control backup/log system. The goal is to automatically save a static copy of the webpage, including all its CSS and JavaScript files, whenever there are any changes made. I have already figured out h ...

Confused about the concept of an Ajax callback? Let's break it down

I am retrieving data from a file, specifically /notes.html. I am attempting to save the result of the ajax call in a variable, but for some reason it keeps showing up as undefined. However, when I execute the function in chrome developer tools, it displays ...