業(yè)務(wù)場景：基于 UI 15.6版本, 彈框 點擊一個按鈕后，固定時間內(nèi)不再彈出能不能實現(xiàn)？
需求分析：這個時候就需要用到我們?yōu)g覽器的 了，當(dāng)點擊按鈕后，將一天后的時間存入到 中，第二次打開時，會首先判斷一下當(dāng)前的時間是否到了 中保存的時間js彈框提示后跳轉(zhuǎn)js彈框提示后跳轉(zhuǎn)，如果沒到，則不用彈出！
功能實現(xiàn)：在線遠行
<html>
<head>
<meta charset="UTF-8" />
<title>MessageBox 彈框一天內(nèi)不再彈出title>
<script src="https://unpkg.com/vue@2">script>
<script src="https://unpkg.com/element-ui@2.15.6/lib/index.js">script>
<script src="https://cdn.bootcss.com/moment.js/2.24.0/moment.min.js">script>
<script src="https://cdn.bootcss.com/moment.js/2.24.0/locale/zh-cn.js">script>
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"/>
head>
<body>
<div id="dynamic-component-demo">
<el-button size="small" type="primary" @click="oneClickFirmOffer">按鈕el-button>
div>
<script>
new Vue({
el: "#dynamic-component-demo",
data: {
searchParam: {}
},
methods: {
oneClickFirmOffer() {
// 判斷當(dāng)前時間是否到了 cookie 中保存的時刻
if (this.getCookie("popped") < moment(new Date()).format("YYYY-MM-DD HH:mm:ss")) {
this.$confirm("這是一個彈窗", "提示", {
confirmButtonText: "朕已閱",
cancelButtonText: "一天內(nèi)不再提示",
confirmButtonClass: "confirmButton",
cancelButtonClass: "cancelButton",
type: "warning"
})
.then(() => {})
.catch(() => {
// 將一天后的時刻存入 cookie ，下次訪問時不會再彈出
let oneDayLater = moment(new Date()).add(1, "d").format("YYYY-MM-DD HH:mm:ss");
document.cookie = "popped = yes";
});
}
},
// 獲取Cookie
getCookie(Name) {
var search = Name + "=";
var returnValue = "";
console.log(Name);
if (document.cookie.length > 0) {
console.log(document.cookie.length);
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;
}
}
});
script>
body>
html>
復(fù)制代