vue 进入首页只弹一个弹框_Vue只弹一次的弹框实例分享

本文主要和大家分享Vue只弹一次的弹框的实例，希望能帮助大家更好的使用vue开发。

核心代码是 getCookie()部分,控制弹框的显示隐藏则在 created()中。

Lorem ipsum dolor sit amet, consectetur adipisicing elit. At, atque ea eveniet laudantium magni, maiores nam nihil non numquam odio pariatur perferendis placeat quas quasi sit soluta, sunt ullam voluptatibus.

export default {

data(){

return{

isShow: true,

}

},

created(){

if (this.getCookie('popped') == ''){ //cookie 中没有 popped 则赋给他一个值(此时弹框显示)

document.cookie = "popped = yes";

}else{

this.isShow = false; //若cookie 中已经有 popped 值，则弹框再不会显示

}

},

methods: {

noPopup(){

this.isShow = false;

},

getCookie(Name) { //cookie

var search = Name + "=";

var returnValue = "";

if (document.cookie.length > 0) {

var offset = document.cookie.indexOf(search);

if (offset !== -1) {

offset += search.length;

var end = document.cookie.indexOf(";", offset);

if (end == -1){

end = document.cookie.length;

}

returnValue = decodeURIComponent(document.cookie.substring(offset, end));

}

}

return returnValue;

},

},

}

/*样式部分*/

相关推荐：