Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

211
Views
Does this Vue code contain a "side effect"?

(Note: this is probably a silly question)

I have some vue code that I have written as practice in a code sandbox of mine in the following link: https://codesandbox.io/s/is-this-a-side-effect-p62khk?file=/src/App.vue

inside of the computed property I have written, it returns an object that references a function that is used by a click event in the current component:

computed: {
    doSomething() {
      return {
        update:
          this.something !== "doink" ? "You are okay" : "You are not okay",
        doThis: this.task, //This is the referenced function used by the click event
      };
    },
  },

Here is the template code with the click event:

<template>
  {{ something }}
  <button @click="doSomething.doThis">{{ "test" }}</button>
  {{ doSomething.update }}
</template>

I would like to pass this returned object from the aforementioned computed property down as a prop to a child component. Also, this referenced method DOES mutate a single reactive state that I have defined in my data model:

Here is the referenced task method:

methods: {
    task() {
      this.something = "doink";
      console.log("task1");
    },
  },

Here is the state within my data model:

data() {
    return {
      something: "bla",
    };
  },

Is this considered a "side-effect" even though I do not directly call its referenced method inside of its body but instead use it later inside of the previously shown click event (of which would most likely would be defined inside of a child component)

NOTE: the reason why I am asking this question is because I am using a library (devextreme) which has some components that required config objects. However, although all of the tutorials that I found show these components using their parent component's data model to store these, I would like these to be stored inside of computed props to have some of their configuration properties update based on certain state changes. AND, more importantly, keep my data model clean and only focused on storing state and NOT configuration for components. An example of these config objects being used in the data model can be shown here:

https://js.devexpress.com/Demos/WidgetsGallery/Demo/Common/CustomTextEditorButtons/Vue/Light/

Any advice or recommendations for this would be much appreciated! Thanks!

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!