javascripthtmlvue.jsouterhtml

i can display an <p> tag with vue js but i cant remove it after 2 sec

i have an input field where i can write in something, now if i press enter a value called "gespeichert" gets true. i also have an p tag that is binded with v-if. now i want it to hide / remove it after 2 or 3 seconds. this is maded with vue.js

i already tried with

                    methods: {

        speichern: function() {
            this.gespeichert = true;
            setTimeout(function(){

                    this.gespeichert = false;

            }, 2000);
                             ....

now i want that gespeichert gets the value false after 2 seconds, why does this not work?

Solution

  • You have a scope issue - this within your setTimeout function is not what it is outside of that function. You can use .bind(this) to solve this:

    setTimeout(function(){
    this.gespeichert = false;
}.bind(this), 2000);