SHARE

Hey gang, in this Vue JS tutorial I’ll show you an alternative to using Vue methods – computed properties.

—– COURSE LINKS:
+ Repo – https://github.com/iamshaunjp/vuejs-playlist
+ Atom editor – https://atom.io/a
+ Download GIT – https://git-scm.com/
+ Vue docs – https://vuejs.org/v2/guide/

———————————————————————————————
You can find more front-end development tutorials on CSS, HTML, JavaScript, jQuery, WordPress, Node.js & more on the channel homepage…

SUBSCRIBE TO CHANNEL – https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg?sub_confirmation=1

========== PSD to WordPress Playlist ==========

https://www.youtube.com/playlist?list=PL4cUxeGkcC9gnow7e45LQFkNVxwQ5BH-W

============ Node.js for Beginners Playlist =============

https://www.youtube.com/playlist?list=PL4cUxeGkcC9gcy9lrvMJ75z9maRw4byYp

============== The Net Ninja =====================

For more front-end development tutorials & to black-belt your coding skills, head over to – https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg or http://thenetninja.co.uk

================== Social Links ==================

Twitter – @TheNetNinja – https://twitter.com/thenetninjauk

19 COMMENTS

  1. This would render Properties and Functions indistinguishable from one another 🙁

    I would recommend NOW that you should append or prepend '_fn' to all your methods so you can differentiate the two for readability

    addToA_fn = function(){}
    or
    fn_addToA

    ALSO if you want to pass a parameter to a computed function your stuffed. This would mean you would need to access a variable from within the function rather than passing a parameter – Which as an OOP programmer that actually makes me want to take a metaphorical shower now.

    If you wanted a global refresh I would have called that from a switch statement with the function rather than make it a default behavior YUCK!

    Anyway – moving on….

  2. In my opinion,
    1.computed properties: We are supposed to use 'this computed prop' when we deal with only the properties in 'data' object, such as 'age', 'a', 'b' in the video. We don't need to have parenthesis '()' in the '{{ addToA }}' or '{{ addToB }}' because we don't need any arguments from outside. We are only computing the values of properties 'within' the data object.
    2. methods: methods are different from computed properties in that methods always need an direct action from a user, that is, an event. But computed properties run without the direct action from a users. They run indirectly only after the direct action from a user.
    3. In short, methods are need to deal with information 'outside' data while computed props are need to deal with information 'inside' data.
    what do you think?

  3. thanks for your time and lessons, i have one question… how i can pass parameters to computed function if i can't use parentheses

  4. Do methods run EVERY time some of the data attributes change? Or it was just because in this case you had the methods called directly within the application body instead that from an event handler? I think it is the later but I want to confirm

  5. Why should we use methods if they are running everytime a value is updating?
    Why shouldn't we just use computed proprties always?
    Please give an example that we must use method

    ps – Thanks for videos! There are really good, Keep up!

LEAVE A REPLY

Please enter your comment!
Please enter your name here