[Vuejs]-How to conditionally apply text to data variable based on props in VueJS

3👍

If you need a data variable that depends of another variable, you must use a computed property.

You have to check about that on de official docs: Computed Properties

And instead of hamburguerUrl on data, you put it on the computed propert

<script>
export default {
  name: "HamburgerMenu",
  props: ["white"],
  computed: {
    hamburgerUrl() {
      return this.white
        ? "/gfx/hamburger-white.png"
        : "/gfx/hamburger-menu.png";
    }
  },
};
</script>

And that’s all.

Leave a comment