Transforming a singular value into an array

Currently, I am using Vue and dealing with a data array that may contain nested arrays. The issue I am facing is that if an item is not stored as an array, I would like to convert it into one for consistency. Here's an example:

my_array:Array[2]
  0:Reactive
    price_type: "Adult"
    price_layer:Array[3]
    price:Array[3]
  1:Reactive
    type: "Child"
    price_layer:Array[3]
    price: 30

In the second element of my array, there is 'price: 30'. I want this to be changed to 'price: [30]' so that it aligns with the requirements of a for loop in Vue. Is there a method to achieve this without creating a new variable and ensuring the integrity of the remaining data?

javascriptarraysvue.js

Answer №1

If the value is not already an array, you can utilize a conditional statement to store it in an array.

my_array.forEach(element => 
  (Array.isArray(element.price) ? element.price : [element.price]).forEach(
    priceToPrint => console.log(priceToPrint)))

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

How can I change "Thu Sep 19 14:24:59 UTC 2019" into a moment date?

Struggling to convert this date: created_at= "Thu Sep 19 14:24:59 UTC 2019" I attempted to use the following code: let elementDate=moment(created_at) However, I keep receiving an error message: moment.invalid(/* Fri Aug 30 09:52:04 UTC 2019 */) I als ...

javascriptdatetimetimezonemomentjs

Utilizing the @keypress event handler in VueJS

I am attempting to incorporate the onkeypress event within a Vue component. My goal is to allow only numbers on keypress while disallowing all other key codes. Here is what I have tried: Implementing the onkeypress event works perfectly! <input type=&q ...

javascriptvue.jsvuejs2vue-componentonkeypress

clearing all input fields upon submission in React Native

I need help resolving an error that occurs when I try to clear text input fields on a button press. Instead of clearing the fields, it throws an undefined error because I am trying to set the value as {this.state.inputTextValue} and then clear it using set ...

javascriptandroidiosnode.jsreact-native

Creating a simple chatbot using jQuery and Ajax, and implementing a feature to ignore lowercase inputs

I'm currently working on a chatbot project and I'm having some difficulties with the input identifier. if (message.indexOf("how are you")>=0){ send_message("Thanks, Iam good!"); responsiveVoice.speak("Thanks, Iam good! ...

javascriptjqueryajax

Creating sophisticated TypeScript AngularJS directive

Recently, I came across a directive for selecting objects from checkboxes which can be found at this link: The issue I'm facing is that we are using TypeScript and I am unsure of how to implement the directive in TypeScript. From what I understand, ...

javascriptangularjstypescriptangular-directive

If the iframe's CSS source is updated, the parent's CSS source will also change

I'm currently working on a unique school project that involves creating multiple CSS styles for different views. <link rel="stylesheet" type="text/css" href="css/main.css" title="main" media="screen"> <link rel="stylesheet" type="text/css" h ...

javascriptjqueryhtmlcssiframe

Is it possible to extract a specific value from JSON data by making an AJAX call or applying a filter to the fetched JSON data?

I have been utilizing a treeview template and successfully displaying all the data. However, I am facing an issue where I need to pass a value from index.php to getdata.php. I attempted using an AJAX filter on the index.php page and also tried sending a v ...

javascriptphpjsonajaxjstree

Enhanced efficiency in the interaction between front-end JavaScript and back-end JavaScript

As a frontend developer, I find myself in the unique position of working on a project that involves processing a large amount of data in my nodeJS backend (while using reactJS for the front end). After the necessary data processing is completed in the bac ...

javascriptnode.jsreactjs

What is the process for removing a specific column (identified by its key value) from a JSON table using JavaScript and Typescript?

[{ "name": "employeeOne", "age": 22, "position": "UI", "city": "Chennai" }, { "name": "employeeTwo", "age": 23, "position": "UI", "city": "Bangalore" } ] If I remove the "Position" key and value from the JSON, the updated r ...

javascriptarraysjsontypescript

Delay the loading of JavaScript libraries and multiple functions that are only executed once the document is

After learning how to defer the loading of JS libraries and a document ready function from this post, I encountered a challenge. The code I currently have handles multiple document ready functions inserted by different modules, not on every page. echo&ap ...

javascriptjqueryoptimizationdeferred-executiondeferred-loading

Click Action on CanJS Table

I am currently developing a canJS application and have been able to successfully handle the click event for an HTML table using the code below. 'table td click':function(el,event){ console.log('clicked ',el.text()); } ...

javascriptcanjscanjs-control

Download a complete website using PHP or HTML and save it for offline access

Is there a way to create a website with a textbox and save button, where entering a link saves the entire website like the 'save page' feature in Google Chrome? Can this be done using PHP or HTML? And is it possible to zip the site before downloa ...

phpjavascripthtmlwebdownload

Is it acceptable to use the return value of false in order to resolve the ESLint consistent-return error when working with asynchronous functions

When working with ExpressJS, I encountered a situation where I needed to execute and adhere to ESLint rules in my code. One particular rule that caused an issue is "consistent-return", which flagged the following code snippet: function getUsers( req, res, ...

javascriptnode.jsexpressasynchronouseslint

What could be causing my webpage to freeze every time a filter button is selected?

Tasked with developing a webpage similar to Pinterest by utilizing data from a JSON response. Each JSON object contains a service_name key, which can be manual, twitter, or instagram. I made an effort to implement three filter buttons to only display the r ...

javascriptjqueryhtmlcssjson

Oops! There was a validation error as the duration was not formatted as a number. Please make sure to provide a valid numerical value for the duration field

When attempting to update data from a MongoDB database and checking the results on Postman, an error is encountered. The error reads as follows: "Error: ValidationError: duration: Cast to Number failed for value \"NaN\" at path \"duration&bs ...

javascriptnode.jsexpressnpmmongoose

Challenges with communication between parent and children components in 'Vue.js'

My application is designed to make multiple requests and display the resulting data. Everything is functioning properly overall, but I am encountering some errors that are proving difficult to identify. The application consists of two main components: -- ...

javascriptvue.jsvuejs2vue-component

"Trying to access jQuery .slide and .slideUp features, but unfortunately they are

I've created this script: $("#comments .comment .links").hide(); $("#comments .comment").hover( function() { $(".links", this).stop(true).slideDown(300); }, function() { $(".links", this).stop(true).slideUp(300); } ); However, I'm facin ...

javascriptjquerycssslide

Publishing a NodeJS + Express + MySQL application on Heroku involves deploying the server side only, excluding the React frontend

I have a React + NodeJS + Express + MySQL project that we're trying to deploy on Heroku. It's set to auto deploy whenever something is pushed to the master branch of GitHub. The problem we're facing is that while the server routes are deplo ...

javascriptnode.jsreactjsexpressheroku

cannot wait for promise in loop to avoid delaying the request

In the API endpoint of a Next.js webapp, this code is designed to fetch all the GitHub repositories, including their names and number of contributors. However, an issue arises when using Promise.all - the call does not return anything (resulting in a stall ...

javascriptnode.jsapinext.jsasync-await

When clicking on an item in the wishlist, only the text for that specific item should change,

Hi all, I'm in need of some assistance. I have successfully created a wishlist toggle where clicking on the heart icon changes it from an outline to solid. However, my issue lies in changing the tooltip text from "add to wish list" to "added to wish l ...

javascript