I then have two methods one is used to evaluate the current expression using eval which is then used to update the value of the num property of the data object. I am using the keyup event in the text input element as a way to directly call the method and update the number when using the text element as a way to create an expression. The click method is used for the buttons that I have made that can also be used to create an expression that way.
Now for some html that links to vuejs and of course my calculator.js file that I have above.
When this vue calculator example is up and running it works okay. I am able to create an expression by editing the text of the text input element for the expression, or use the buttons. There is all ready a great deal I would change when it comes to using a render method rather than a static template, and adding additional features, but the basic idea of a general vue calculator is there.
Of course there are many other types of calculators other than what it is that I covered in this post. There are many other ways to design these with vuejs by using render methods, in place of templates, and making use of other ways to work with user input such as a canvas tag combines with mouse and touch events. There are of course all kids of calculators, such as scientific ones, and ones that are justg used to compute how much money a loan payment will be. Hopefully this will help to give you some ideas as to how to get going with this though.