JavaScript object rejects JSON input

Below is the script that I am currently working with:

const [firstResponse, secondResponse] = await Promise.all([
   this.$store.dispatch(Actions.RELATIONS),
   ApiService.get("/api/"+ this.apiEndpointSingle +'/'+this.uid)
]);

console.log(secondResponse)
this.formData = secondResponse.data.result[this.apiEndpointSingle];

After logging the variable secondResponse, it seems to return an unexpected JSON value at the key "tags" as an empty array. This is puzzling and new to me.

Initial API Response:

{
  "id": 1,
  "created_at": "2021-06-15T12:10:41.000000Z",
  "updated_at": null,
  "created_by": 1,
  "status": 1,
  "uid": null,
  "tags": "[\"2\"]",
  "sale_status": "completed",
  "reference": "test1",
  "sale_date": "2021-06-17T14:33:00.000000Z",
  "currency": null,
  "connection_id": null,
  "relation_id": 1,
  "profile_id": 1,
  "address_id": 1,
  "profile_name": "P1",
  "relation_name": "R1"
}

Updated Output post console logging secondResponse:

{
    "id": 1,
    "created_at": "2021-06-15T12:10:41.000000Z",
    "updated_at": null,
    "created_by": 1,
    "status": 1,
    "uid": null,
    "tags": [],
    "sale_status": "completed",
    "reference": "test1",
    "sale_date": "2021-06-17T14:33:00.000000Z",
    "currency": null,
    "connection_id": null,
    "relation_id": 1,
    "profile_id": 1,
    "address_id": 1,
    "profile_name": "P1",
    "relation_name": "R1"
}

Answer №1

After investigating the problem, I have successfully resolved it. The issue was not related to the section of script you mentioned. It actually stems from the v-model system, which updates data later on in the process.

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

What is the best way to retrieve a specific value in an array object using JavaScript?

I'm working with an array that has the structure shown below: balance = [ {id: 2, is_selected: true}, {id: 4, is_selected: true}, {id: 15, is_selected: false}, {id: 137, is_selected: false}, {id: 30, is_selected: false} ]; Is ther ...

Is there a way to ensure that all asynchronous functions have finished executing before assigning them to module.exports?

Currently, I am working on developing an app that generates routes based on data retrieved from a MongoDB database using Mongoose. Here is the current setup: var app = express(); var articleRoute = require('./article.js'); var Articles = requi ...

How to Send jQuery ajax Requests with Multiple Buttons in a PHP Form

My current issue is as follows: <html> <head> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> </head> <body> <form id="roomform" action="room.php" method="POST"> <b ...

Wait for Axios Request Interceptor to complete before sending another ajax call

One feature I have added is a request interceptor for all axios calls. This interceptor checks the JWT token and automatically refreshes it if necessary. axios.interceptors.request.use((config) =>{ const currentState = store.getState(); // get upd ...

What methods can I utilize to expand the qix color library with personalized manipulation features?

Utilizing the qix color library, my goal is to create specific custom manipulation functions for use in a theme. The approach I am taking looks something like this: import Color from 'color'; const primary = Color.rgb(34, 150, 168); const get ...

The 'admin' attribute is not found in the 'Object' data type

I have been facing this issue for quite some time now. The backend API response is indicating that a certain property does not exist, even though it clearly does. My Angular application suddenly started showing 18 errors today, and I am at a loss on how ...

Activate when every single pixel within an element is see-through

I've designed a web page that includes two canvas elements stacked on top of each other. The purpose of this setup is to allow me to "erase" the top canvas and reveal an image loaded into the bottom canvas. So far, this functionality has been working ...

Printing a modified div element that was created using jQuery on an ASP.NET MVC webpage after the initial page has finished loading

In my view, there is a div that holds multiple tables generated based on the model. Each row in these tables contains fields that can be edited using TextBoxFor. Through jQuery, rows can be moved between tables and new tables can be created dynamically wit ...

When a URL is entered, information is not retrieved from the database

I have a simple app setup where the data (iPhones from the database) is fetched in the AppComponent itself. ngOnInit(): void { this.iphoneservice.fetchIphones(); } The fetchIphones method is located in my iPhoneService file and consists of 3 functio ...

Guide on sending a JSON object to an EJS javascript loop efficiently

Seeking assistance with passing a Json object named myVar to the home.ejs file below. How should I assign the value to the variable called data? <table id="example" class="table table-striped table-bordered dataTable" cellspacing="0" width="100%"> ...

The functionality of getAttribute has changed in Firefox 3.5 and IE8, no longer behaving as it did before

Creating a JavaScript function to locate an anchor in a page (specifically with, not an id) and then going through its parent elements until finding one that contains a specified class. The code below works perfectly in Firefox 3.0 but encounters issues wi ...

What's the best way to implement image size and type validation, specifically for .jpg and .png files, using Multer?

When using multer to receive files from the FrontEnd, I need to validate the image size to ensure it's less than 1MB. Additionally, I want to restrict the accepted file types to .jpg, .jpeg, and .png only. const multer = require("multer"); c ...

Running TestCafe in headless mode with Chrome is sometimes causing inconsistent failures when using Vue event emit functionality

Browser: Chrome Version 91.0.4472.114 (Official Build) (x86_64) Testing Framework: TestCafe 1.14.2 Vue Code Snippets Template Example <input id="amount" v-model="amount" min="0" name="amount" class=&qu ...

Ways to restrict the quantity of Firebase compound indexes required for querying with various filters

I'm in the process of developing a Firestore project that includes group chats and forums where users can filter posts based on various criteria: Number of likes Presence of attachments (photos and/or files) 4 Tags (Questions, Exams, Assignments, Not ...

Launching npm start with Vue.js 2 and webpack opens and refreshes in Firefox, not in Chrome

Currently, I am following the Vue.js tutorial "The Ultimate Vue JS 2 Developers Course"(Project 2) and encountering an issue with the browser refresh on file change. I am using Kubuntu 16.04 with Chrome as my system's default browser. However, every t ...

Aurelia TypeScript app experiencing compatibility issues with Safari version 7.1, runs smoothly on versions 8 onwards

Our team developed an application using the Aurelia framework that utilizes ES6 decorators. While the app works smoothly on Chrome, Firefox, and Safari versions 8 and above, it encounters difficulties on Safari 7.1. What steps should we take to resolve th ...

Ways to restrict a function to a single DOM element using either its id or class

This script is responsible for dynamically loading pages on my website. It works fine, except that it currently iterates over all anchor tags a on the site, whereas I want it to iterate only through my navigation menu. Here is the navigation menu: <div ...

Having issues with Bootstrap flip div not functioning properly when clicked on a mobile device?

I am currently working on a website and encountering an issue. Here is the code snippet I am using: https://jsfiddle.net/3caq0L8u/ The objective is to flip a div when a button is clicked. The button responsible for flipping the div resides in both the " ...

Interop-require-default is nowhere to be found in the babel-runtime

I'm really stuck on how to resolve this error. I've tried searching online and followed the suggestions given by others. I even went as far as deleting 'node_modules' and reinstalling, but nothing seems to be working. The specific erro ...

Form-linked Progress Bar

This is a little project I created (for fun and learning purposes, even though it may not be the most optimized solution). If you're interested, here's the link to the code: https://codepen.io/paschos/pen/xxGXMQb I'm currently seeking assi ...