Adding a character sequence to a parsed JSON object results in a literal string outcome

I have saved some currency information in the state manager of my app and here is how I am accessing it:

For example, to retrieve the value of Euro against the dollar, I use the following code:

JSON.parse(this.$store.state.clientSide.currencyrates).rates.EURO

When a currency is selected through a click event, I extract the currency symbol and pass it to the code above to fetch the exchange rate.

let currency = e.currentTarget.getAttribute('currency');
let new_currency = currency.toUpperCase();
var state_fx = JSON.parse(this.$store.state.clientSide.currencyrates).rates.`${new_currency}`;
this.$store.commit('setCurrency', new_currency);
alert('state fx'+state_fx);

My expectation was for the alert() to display the numerical exchange rate, however, I am instead getting a long string of

JSON.parse(this.$store.state.clientSide.currencyrates).rates.INR
when attempting to retrieve the rupee exchange rate.

Even trying the following:

var state_fx = "JSON.parse(this.$store.state.clientSide.currencyrates).rates."+new_currency;

results in the same outcome. How can I safely pass the currency symbol so that I receive the correct exchange rate?

Answer №1

To access the currency rates using bracket notation, you can do the following:

const currencyRates = JSON.parse(this.$store.state.clientSide.currencyrates);
const newCurrencyRate = currencyRates.rates[new_currency];

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

Guide on incorporating a JS file in a React application

I recently obtained a template for my website that includes the following JS file which is being called from my React component. !(function($) { "use strict"; // Hero typed if ($('.typed').length) { var typed_strings = $(&quo ...

Pushing state history causes browser back and forward button failure

I'm currently utilizing jQuery to dynamically load content within a div container. On the server side, the code is set up to detect if the request is being made through AJAX or GET. In order to ensure that the browser's back and forward buttons ...

Getting the name and value from an object

Just starting out with Javascript and Nodejs, using express and making a call to the following link: localhost:7080/v1/movies/order/notify/insert?breed=Whippet&age=10 After that, I am attempting to extract the property name along with its correspon ...

Can someone provide instructions on how to convert base64 data to an image file

I'm utilizing the vue-signature Library but I am unsure how to download the base64 data that is generated as an image. Here is the link to the library: https://www.npmjs.com/package/vue-signature. I have gone through the documentation and noticed that ...

How can a TypeScript Angular directive utilize a function?

Recently, I have been following a unique Angular directive TypeScript pattern that I find really effective. The approach involves giving the directive its own isolated scope by creating a new controller. I encountered a scenario where I needed to invoke a ...

Leverage JQuery Mobile for smooth sliding and effortless deletion of list elements

Currently, I am testing a JQuery Mobile webpage that features a simple list setup: Upon clicking the list items, they get highlighted and their ids are saved in a local array. Is there an easy (or not so easy) way to transition the selected elements slidi ...

How can I send identical posts to multiple servers and link specific data to each post?

I am attempting to send a post request to multiple servers using jQuery, potentially facing issues with CORS. I have an array containing the jQuery posts and I register the same callback function for each individual one like this: var requestUrls = getReq ...

"Encountering issue with componentDidMount() not functioning as expected, despite debugger being

Hello everyone! This is my first time sharing something here, so I'm eager to hear your feedback on both how I've posted and the content itself. I've only been programming for 8 weeks now, so I'm sure there are plenty of mistakes in wha ...

Unable to relocate the cursor to an empty paragraph tag

Wow, I can't believe how challenging this issue is. My current project involves implementing the functionality for an enter key in a content editable div. Whenever the user hits enter, I either create a new p tag and add it to the document or split t ...

What is the origin of the second parameter in an arrow function that returns another arrow function in a React component with Redux?

I'm having trouble understanding where the (val) parameter is coming from in the returned arrow function. I understand that max/minLength is an arrow function taking an argument set on the input field (3 and 25), and it returns another arrow function ...

Using RabbitMQ in a Node.js application to illustrate an example of header exchange

I've been on a quest to find an example of using RabbitMQ with Node.js for a headers exchange. If anyone could guide me in the right direction, I would greatly appreciate it. Here's what I've managed to put together so far: The publisher me ...

Restrict the height of posts created in the summernote editor

My goal is to create a structured page application using summernote. When using summernote, a div with contenteditable=true is appended to the body to allow users to add content. However, I want to set a fixed height for this div so that users can only ent ...

I'm having trouble using Discord.js to set up a custom role with specialized permissions for muting users

module.exports = { name: "mute", description: "This command is used to mute members in a server", execute: async function (msg, arg) { const muteRole = await msg.guild.roles.cache.find((r) => r.name == "Mute ...

Using JSON in JavaScript to handle the click event of ASP.NET buttons

Here is the code that works well for me. I need to execute two different server-side functions, and they can't run at the same time as I have separated them. Default.aspx/AddCart btnUpdate Click Event The issue I'm facing is that the alert box ...

Struggling to make React respond to button clicks without resorting to using addEventListener

Can anyone help me figure out why I can't get the onclick handler to execute in reactjs when specifying it inline for a button? The only solution that worked for me was using addEventListener. From what I understand, this code should work: <button ...

Issue with $.ajax({}) causing Express Session to fail saving

I'm facing an issue where I am trying to store data in an Express session, but it seems that Express is treating each AJAX request as a new session and not saving my data consistently. Here's the client-side code: $.ajax({ url: '/orders& ...

What steps can be taken to prevent an event from being triggered once it has already started but has not yet concluded?

Let's talk about the navigation bar on the website. Clicking on it toggles the menu holder to slide in and out from the side. It's a simple interaction. The bar contains an icon with the text 'MENU'. When you open the menu, the icon cha ...

What are some ways to optimize the use of the jquery.mCustomScrollbar.js script?

I have a myriad of inquiries and would greatly appreciate your assistance in addressing them. Despite spending countless hours attempting to solve the issue independently, I have been unsuccessful. One question that plagues me is why, when using Google Ch ...

Issue with Material UI Textfield functionality on mobile Safari browser

UPDATE: Resolved the problem by including this code in index.css input { -webkit-user-select:text;} In my application, I am using a Material UI box that contains text fields with an onChange handler. While the TextFields function correctly on most bro ...

Angular2 Dropdown not updating with values from API

Here is the structure of my project flow: import_product.html <div class="row custom_row"> <div class="col-md-2">Additional Duty: </div> <div class="col-md-2"> < ...