Subscribe on changes!

Why constants declared without using reactive and ref are mutable

avatar
Aug 27th 2020

Version

3.0.0-rc.9

Reproduction link

https://codesandbox.io/s/icy-https-h1mv8?file=/src/App.vue

Steps to reproduce

based in this question on stackoverflow i declared a const inside the setup function and I returned it, then i tried to update in methods option and i saw that it could be mutated :

<template>
  <div>
    <button @click="operate">Test it</button>
    {{myConst}}
  </div>
</template>

<script>
import { ref } from "vue";
export default {
  setup() {
    const myConst = "I'm a const"; 

    return {
      myConst
    };
  },
  name: "App",
  methods: {
    operate() {
      this.myConst = "Why this updates?";
    }
  }
};
</script>

What is expected?

An error like:

Uncaught TypeError: Assignment to constant variable.

What is actually happening?

the constant is mutated

avatar
Aug 27th 2020

image

avatar
Aug 27th 2020

Oh, i didn't think about that, i forgot that we still working with javascript