Update a variable in vue.js

Question

I have a web app written in vue in which the user has to submit an amount. I want to create an integer variable total_amount that updates at each run. For eg, one user submits 50$, so total_amount should update to 50$, then another user submits 25$, then total_amount should update to 75$. So, I want a variable that updates it's value at the click of a button and then I'm returning this updated value to a function on the same page. Is there a way to achieve this on the frontend side itself, without any database or backend assistance?

data() {
    return {
      total_amount: 0
    }
}

I initialized total_amount in this way, but the problem is that it starts from 0 at each run, so it does not add on the previous amount rather just returns the current value.

It's technically possible. You'd need some way to persist the data on the backend (if not a database solution, then perhaps a simple JSON file), and the frontend would need to query the backend for that data in order to synchronize any changes. — tony19
– tony19, Commented Apr 21, 2021 at 5:00
You can also use local storage in the browser, load the variable from the local storage in the create() and update it in the button method or doing a watch on the variable — Dicren
– Dicren, Commented Apr 21, 2021 at 5:57
@Pradyut, What web server are you using? this will help with using Tonys solution. — Michael Mano
– Michael Mano, Commented Apr 21, 2021 at 5:59

Zhyar Abdallah · Accepted Answer · 2021-04-21 07:40:48Z

1

you need to use a backend server or a database to store that value , since this value gets accessed by deferent clients and session so it needs to be stored like a variable or a column in your database ,see below simple node Js backend

var http = require('http');

var total_amount= 0;

var server = http.createServer(function (req, res) {

    total_amount++;

    res.writeHead(200, { 'Content-Type': 'text/plain' });

    res.write('Hello!\n');

    res.write('We have had ' + total_amount+ ' visits!\n');

    res.end();

 

});

server.listen(9090);

console.log('server running...')

answered Apr 21, 2021 at 7:40

Zhyar Abdallah

463 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Update a variable in vue.js

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related