How to declare Vuex gettres return data in a map function - vue.js

Question

I have declared state and getters in my vuex where I want to get new price and title of the existing products in state.
When I have declared the return data in the getters It is throwing a syntax error and which is ; expected , given.
But from my point of view it is correct so what is the exact error?
state: {
value1: 1,
products: [
{ title: 'Hp1', price: 500 },
{ title: 'Hp2', price: 600 },
{ title: 'Hp3', price: 700 },
]
},
getters: {
saleProducts: state => {
var newProductsList = state.products.map(product => {
return
{
title: '** '+ product.title +' **',
price: product.price/2 + " % Off"
}
});
return newProductsList;
}
}

Answer 1

This is a bit bizzarre. When I copied and pasted your code then it doesn't work. When I type it in by hand myself from your example, then it works. Usually this sort of thing means that you've got an invalid ASCII character in the mix somewhere. The main thing I changed was to using double quotes instead of single quotes:
state: {
value1: 1,
products: [
{ title: 'Hp1', price: 500 },
{ title: 'Hp2', price: 600 },
{ title: 'Hp3', price: 700 },
]
},
getters: {
saleProducts: state => {
var newProductsList = state.products.map(product => {
return {
title: "** " + product.title + " **",
price: product.price/2 + " % Off"
}
})
}
},
See if you can spot the difference. Here's the codesandbox.io link: https://codesandbox.io/s/ywr1v7my19
Browse to /store/modules/main.js to see it in situ.