`This` is undefined in vue.js watcher : <p>I have component with watcher</p>

<pre><code>props: {
    propShow: { required: true, type: Boolean }
},

data() {
    return {
        show: this.propShow
    }
},

watch: {
    propShow: {
        handler: (val, oldVal) =&gt; {
            this.show = val;
        }
    }
}
</code></pre>

<p>Whenever <code>parent</code> component changes <code>propShow</code> this component must update it's <code>show</code> property. <code>This</code> component also modifies <code>show</code> property, that's why I need both: <code>show</code> and <code>propShow</code>, because Vue.js does not allow to change properties directly.</p>

<p>This line</p>

<pre><code>this.show = val;
</code></pre>

<p>causes error</p>

<pre><code>TypeError: Cannot set property 'show' of undefined
</code></pre>

<p>because <code>this</code> inside handler is <code>undefined</code>.</p>

<p>Why?</p>
