How to create an object through loop using vue multiselect - javascript

I'm using vue multiselect for a project with laravel.
The selected values are saved in the database in this way.
['value_on','value_two','value_three', and so on...]
In the part where the user can do the updates I need to display the values coming from the database.
This is the object I need to create
sizeValue: [
{size: 'val_one},
{size: 'val_two},
{size: 'val_three}
...and so on
]
Right now I just have an empty array where I should loop the data from the database.
//This is the empty array
sizeValue: [];
//This is the array coming from the server it will return['val_one','val_two','val_three',...and so on]
product.sizes
Since I don't have much experience with javascript I would like to ask how I can get this result
sizeValue: [
{size: 'val_one},
{size: 'val_two},
{size: 'val_three}
...and so on
]
looping the values (product.sizes) coming from the DB in the empty sizeValue.

you could simply create the sizeValue as a computed property and use the javascript map function.
This could look like this:
<script>
export default {
computed: {
sizeValue() {
return this.product.sizes.map(productSize => {
return {
size: productSize
};
});
}
}
};
</script>
Hope this helps :)

Related

How do I export complex json data to excel/google sheet

I am getting the following Json string from Firebase Realtime database.
{
'algotable': {
'-NJ6blqyqu8RgjvdQJyT': {
'actual': '123',
'cipher': '39bc62c2ad990f494e0ad2b5715a3f05',
'decrypted': '123'
},
'-NJ6bmsPnb1GNi_jYyPb': {
'actual': 'abcd',
'cipher': '39bc62c2ad990f494e0ad2b5715a3f05',
'decrypted': 'abcd',
}
}
}
I tried importing json file in micrsoft excel but it shows only two columns without any data i.e. algotable,records
I tried google appscript
console.log(string1.algotable.getData);
but I don't get any output because object inside algotable always changes its name whenever I push an object through android-java as below
public String writeNewRecordEncrypt(Algotable algotable) {
DatabaseReference pushref = mDatabase.push();
pushref.setValue(algotable);
return pushref.getKey();
}
please help me amend this. thanks in advance

How to fetch data in vueJS?

a column data is showing in array : ["1k","2k","3k"]
I used foreach to filter and the data type is showing string and it shows like this again: ["1k","2k","3k"]
If I convert this into an array then v-for loop does not show data.
photographers data is the API action state.
Output: I want to print each value in dropdown from this array.
I am trying to do v-for on print.
I tried to do print as a computed function but no result.
If you want all code then I can print its too much logic that's why I have trimmed it which is required.
Thanks
code:
data() {
return {
print: [],
printPrice: [],
},
computed: {
getImageDetails(){
this.photographersdata.forEach((details) => {
if(details.id === parseInt(this.imageId)){
this.print = details.print;
this.printPrice = details.print_price;
}
})
},```

How do I fetch Weather's API 'forecastday' using axios?

I use WeatherAPI's service, which returns the weather forecast given the city name
The URL looks like this https://api.weatherapi.com/v1/forecast.json?key=[API_KEY]&q=tokyo&aqi=no
After trying to paste that URL into my browser and pasting the result into a JSON beautifier, here's the result
Here's the weird part. I tried using axios to fetch the information from my app and printing it out, this is what it gave me
It was unable to fetch forecastday and instead gave me a [Object], which didn't make any sense to me since it worked just fine on my browser
Here's my code (sorry for the spaghetti formatting)
https://pastebin.com/9eJQy5Bf
I tried reinstalling the library, using proxies but the result remained the same.
forecast.forecastday is an object array, to access a property from a particular object, you have to specify the index of the object in the array.
For example if you want the date property of the first object.
const data = {
forecast: {
forecastday: [{
date: "2022-04-03"
}]
}
}
const date = data.forecast.forecastday[0].date; // index [0] = first element
console.log(date);
If you would have multiple days, you could loop over them or use a function like map() to get the specific items.
const data = {
forecast: {
forecastday: [{
date: "2022-04-03",
date_epoch: 123456789
},
{
date: "2022-04-04",
date_epoch: 123456789
}
]
}
}
const dates = data.forecast.forecastday.map(({ date }) => {
return { date }
});
console.log(dates);

How to update the value of a single property within a state object in React.js?

So I have the following object structure:
const SamplePalette = {
id: 1,
name: "Sample Palette",
description: "this is a short description",
swatches: [
{
val: "#FF6245",
tints: ["#FFE0DB", "#FFA797"],
shades: ["#751408", "#C33F27"]
},
{
val: "#FFFDA4",
tints: ["#FFFFE1"],
shades: ["#CCCB83"]
},
{
val: "#BFE8A3",
tints: ["#E7FFD7"],
shades: ["#95B77E"]
}
]
}
Let's imagine that this object is managed by the state of my app like this:
this.state = {
currentPalette: SamplePalette,
}
My question is how would I go about updating the val property of a given swatch object in the swatches array? Or more generally - how do I only update pieces of this object?
I tried using the update helper as well as to figure out how Object.assign() works, however I've been unsuccessful and frankly can't really grasp the syntax by just looking at examples.
Also, since I'm going to be modifying this object quite a lot, should I look into maybe using Redux?
[EDIT]
I tried #maxim.sh suggestion but with no success:
this.setState(
{ currentPalette: {...this.state.currentPalette,
swatches[0].val: newValue}
})
Consider you have new new_swatches
I think the clearer way is to get array, update it and put back as:
let new_swatches = this.state.currentPalette.swatches;
new_swatches[0].val = newValue;
this.setState(
{ currentPalette:
{ ...this.state.currentPalette, swatches: new_swatches }
});
Also you have : Immutability Helpers or https://github.com/kolodny/immutability-helper
Available Commands
{$push: array} push() all the items in array on the target.
{$unshift: array} unshift() all the items in array on the target.
{$splice: array of arrays} for each item in arrays call splice() on the target with the parameters provided by the item.
{$set: any} replace the target entirely.
{$merge: object} merge the keys of object with the target.
{$apply: function} passes in the current value to the function and updates it with the new returned value.

Adding a new key-value to a map in Dynamo DB in JavaScript

I have an item in a dynamodb table that has a key of type map. The name of the key is mykey and the map stored in the key is:
{
name: something
address: somewhere
}
I want to add a new item to this map data. Let's say for example, color. The updated map should look like this:
{
name: something
address: somewhere
color: red
}
I am using JavaScript SDK but I'm unable to figure out how to go about this. After reading documentation, I think I need to use list_append in updateItem function but I am not able to figure out how.
I do not want to read data, add the new key-value, and write back. This will create a 'read before write' concurrency problem as I have multiple processes trying to update the map.
You need to use the updateItem API. I don't have a specific example in JavaScript, but the basic idea is this:
var params = {
Key: {
KeyName: {
S: "KeyValue"
}
},
TableName: "TheTableName",
AttributeUpdates: {
color: {
Action: "ADD",
Value: {
S: "red"
}
}
}
};
client.updateItem(params, callback);

Categories

Resources