分享一个JavaScript后台管理项目超实用的提示框

最新推荐文章于 2024-11-13 01:18:00 发布
最新推荐文章于 2024-11-13 01:18:00 发布
阅读量874 收藏 3
点赞数 35
文章标签： javascript 开发语言 ecmascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_71966801/article/details/134339757
版权

目录

新建js文件 

设置css样式 

html布局 

script代码

调用方式 

展示效果 

新建js文件 

 首先我们需要新建一个js文件夹，将下方代码丢进去

"use strict";

function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

!function (global, factory) {
  (typeof exports === "undefined" ? "undefined" : _typeof(exports)) === "object" && typeof module !== "undefined" ? module.exports = factory() : typeof define === "function" && define.amd ? define(factory) : (global = global || self, global.cocoMessage = factory());
}(void 0, function () {
  "use strict";

  var msgWrapper = c({
    className: "coco-msg-stage"
  });

  function c(args, children) {
    var el = document.createElement("div");

    for (var key in args) {
      var element = args[key];

      if (key == "className") {
        key = "class";
        el.setAttribute(key, element);
      } else if (key[0] == "_") {
        el.addEventListener(key.slice(1), element);
      }
    }

    if (typeof children == "string") {
      el.innerHTML = children;
    } else if (_typeof(children) == "object" && children.tagName) {
      el.appendChild(children);
    } else if (children) {
      for (var i = 0; i < children.length; i++) {
        var child = children[i];
        el.appendChild(child);
      }
    }

    return el;
  }

  function addAnimationEnd(el, fn) {
    ["a", "webkitA"].forEach(function (prefix) {
      var name = prefix + "nimationEnd";
      el.addEventListener(name, function () {
        fn();
      });
    });
  }

  function css(el, css) {
    for (var key in css) {
      el.style[key] = css[key];
    }

    if (el.getAttribute("style") === "") {
      el.removeAttribute("style");
    }
  }

  function addClass(el, s) {
    var c = el.className || "";

    if (!hasClass(c, s)) {
      var arr = c.split(/\s+/);
      arr.push(s);
      el.className = arr.join(" ");
    }
  }

  function hasClass(c, s) {
    return c.indexOf(s) > -1 ? !0 : !1;
  }

  function removeClass(el, s) {
    var c = el.className || "";

    if (hasClass(c, s)) {
      var arr = c.split(/\s+/);
      var i = arr.indexOf(s);
      arr.splice(i, 1);
      el.className = arr.join(" ");
    }

    if (el.className === "") {
      el.removeAttribute("class");
    }
  }

  var initArgs = {
    msg: "",
    duration: 2000,
    showClose: false
  };
  var cocoMessage = {
    info: function info() {
      initConfig(arguments, "info");
    },
    success: function success() {
      initConfig(arguments, "success");
    },
    warning: function warning() {
      initConfig(arguments, "warning");
    },
    error: function error() {
      initConfig(arguments, "error");
    },
    loading: function loading() {
      return initConfig(arguments, "loading");
    },
    destroyAll: function destroyAll() {
      _destroyAll();
    },
    config: function config(obj) {
      for (var key in obj) {
        if (Object.hasOwnProperty.call(obj, key)) {
          if (obj[key] !== undefined) {
            initArgs[key] = obj[key];
          }
        }
      }
    }
  };

  function initConfig(obj, type) {
    var args = {};

    for (var key in initArgs) {
      args[key] = initArgs[key];
    }

    for (var i = 0; i < obj.length; i++) {
      var it = obj[i];

      if (it !== undefined) {
        if (typeof it == "string" || _typeof(it) == "object") {
          args.msg = it;
        } else if (typeof it == "boolean") {
          args.showClose = it;
        } else if (typeof it == "function") {
          args.onClose = it;
        } else if (typeof it == "number") {
          args.duration = it;
        }
      }
    }

    args.type = type;
    return createMsgEl(args);
  }

  function createMsgEl(args) {
    var type = args.type,
        duration = args.duration,
        msg = args.msg,
        showClose = args.showClose,
        onClose = args.onClose;
    var closable = duration === 0;
    var iconObj = getIconObj();

    if (type == "loading") {
      msg = msg === "" ? "正在加载，请稍后" : msg;
      closable = showClose;
      duration = 0;
    }

    var el = c({
      className: "coco-msg-wrapper"
    }, [c({
      className: "coco-msg coco-msg-fade-in " + type
    }, [c({
      className: "coco-msg-icon"
    }, iconObj[type]), c({
      className: "coco-msg-content"
    }, msg), c({
      className: "coco-msg-wait " + (closable ? "coco-msg-pointer" : ""),
      _click: function _click() {
        if (closable) {
          closeMsg(el, onClose);
        }
      }
    }, getMsgRight(closable))])]);
    var anm = el.querySelector(".coco-msg__circle");

    if (anm) {
      css(anm, {
        animation: "coco-msg_" + type + " " + duration + "ms linear"
      });

      if ("onanimationend" in window) {
        addAnimationEnd(anm, function () {
          closeMsg(el, onClose);
        });
      } else {
        setTimeout(function () {
          closeMsg(el, onClose);
        }, duration);
      }
    }

    if (type == "loading" && duration !== 0) {
      setTimeout(function () {
        closeMsg(el, onClose);
      }, duration);
    }

    if (!msgWrapper.children.length) {
      document.body.appendChild(msgWrapper);
    }

    msgWrapper.appendChild(el);
    css(el, {
      height: el.offsetHeight + "px"
    });
    setTimeout(function () {
      removeClass(el.children[0], "coco-msg-fade-in");
    }, 300);

    if (type == "loading") {
      return function () {
        closeMsg(el, onClose);
      };
    }
  }

  function getMsgRight(showClose) {
    if (showClose) {
      return "\n    <svg class=\"coco-msg-close\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" p-id=\"5514\"><path d=\"M810 274l-238 238 238 238-60 60-238-238-238 238-60-60 238-238-238-238 60-60 238 238 238-238z\" p-id=\"5515\"></path></svg>\n    ";
    } else {
      return "<svg class=\"coco-msg-progress\" viewBox=\"0 0 33.83098862 33.83098862\" xmlns=\"http://www.w3.org/2000/svg\">\n    <circle class=\"coco-msg__background\" cx=\"16.9\" cy=\"16.9\" r=\"15.9\"></circle>\n    <circle class=\"coco-msg__circle\" stroke-dasharray=\"100,100\" cx=\"16.9\" cy=\"16.9\" r=\"15.9\"></circle>\n    </svg>\n    ";
    }
  }

  function closeMsg(el, cb) {
    if (!el) return;
    css(el, {
      padding: 0,
      height: 0
    });
    addClass(el.children[0], "coco-msg-fade-out");
    cb && cb();
    setTimeout(function () {
      if (!el) return;
      var has = false;

      for (var i = 0; i < msgWrapper.children.length; i++) {
        if (msgWrapper.children[i] === el) {
          has = true;
        }
      }

      has && removeChild(el);
      el = null;

      if (!msgWrapper.children.length) {
        has && removeChild(msgWrapper);
      }
    }, 300);
  }

  function getIconObj() {
    return {
      info: "\n    <svg t=\"1609810636603\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" p-id=\"3250\"><path d=\"M469.333333 341.333333h85.333334v469.333334H469.333333z\" fill=\"#ffffff\" p-id=\"3251\"></path><path d=\"M469.333333 213.333333h85.333334v85.333334H469.333333z\" fill=\"#ffffff\" p-id=\"3252\"></path><path d=\"M384 341.333333h170.666667v85.333334H384z\" fill=\"#ffffff\" p-id=\"3253\"></path><path d=\"M384 725.333333h256v85.333334H384z\" fill=\"#ffffff\" p-id=\"3254\"></path></svg>\n    ",
      success: "\n    <svg t=\"1609781242911\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" p-id=\"1807\"><path d=\"M455.42 731.04c-8.85 0-17.75-3.05-24.99-9.27L235.14 553.91c-16.06-13.81-17.89-38.03-4.09-54.09 13.81-16.06 38.03-17.89 54.09-4.09l195.29 167.86c16.06 13.81 17.89 38.03 4.09 54.09-7.58 8.83-18.31 13.36-29.1 13.36z\" p-id=\"1808\" fill=\"#ffffff\"></path><path d=\"M469.89 731.04c-8.51 0-17.07-2.82-24.18-8.6-16.43-13.37-18.92-37.53-5.55-53.96L734.1 307.11c13.37-16.44 37.53-18.92 53.96-5.55 16.43 13.37 18.92 37.53 5.55 53.96L499.67 716.89c-7.58 9.31-18.64 14.15-29.78 14.15z\" p-id=\"1809\" fill=\"#ffffff\"></path></svg>\n    ",
      warning: "\n    <svg t=\"1609776406944\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" p-id=\"18912\"><path d=\"M468.114286 621.714286c7.314286 21.942857 21.942857 36.571429 43.885714 36.571428s36.571429-14.628571 43.885714-36.571428L585.142857 219.428571c0-43.885714-36.571429-73.142857-73.142857-73.142857-43.885714 0-73.142857 36.571429-73.142857 80.457143l29.257143 394.971429zM512 731.428571c-43.885714 0-73.142857 29.257143-73.142857 73.142858s29.257143 73.142857 73.142857 73.142857 73.142857-29.257143 73.142857-73.142857-29.257143-73.142857-73.142857-73.142858z\" p-id=\"18913\" fill=\"#ffffff\"></path></svg>\n    ",
      error: "\n    <svg t=\"1609810716933\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" p-id=\"5514\"><path d=\"M810 274l-238 238 238 238-60 60-238-238-238 238-60-60 238-238-238-238 60-60 238 238 238-238z\" p-id=\"5515\" fill=\"#ffffff\"></path></svg>\n    ",
      loading: "\n    <div class=\"coco-msg_loading\">\n    <svg class=\"coco-msg-circular\" viewBox=\"25 25 50 50\">\n      <circle class=\"coco-msg-path\" cx=\"50\" cy=\"50\" r=\"20\" fill=\"none\" stroke-width=\"4\" stroke-miterlimit=\"10\"/>\n    </svg>\n    </div>\n    "
    };
  }

  function removeChild(el) {
    el && el.parentNode.removeChild(el);
  }

  function _destroyAll() {
    for (var i = 0; i < msgWrapper.children.length; i++) {
      var element = msgWrapper.children[i];
      closeMsg(element);
    }
  }

  window.addEventListener('DOMContentLoaded', function () {
    insertCssInHead();
  });

  function insertCssInHead() {
    var doc = document;

    if (doc && doc.head) {
      var head = doc.head;

      var _css = doc.createElement('style');

      var cssStr = "\n\n[class|=coco],[class|=coco]::after,[class|=coco]::before{box-sizing:border-box;outline:0}.coco-msg-progress{width:13px;height:13px}.coco-msg__circle{stroke-width:2;stroke-linecap:square;fill:none;transform:rotate(-90deg);transform-origin:center}.coco-msg-stage:hover .coco-msg__circle{-webkit-animation-play-state:paused!important;animation-play-state:paused!important}.coco-msg__background{stroke-width:2;fill:none}.coco-msg-stage{position:fixed;top:20px;left:50%;width:auto;transform:translate(-50%,0);z-index:3000}.coco-msg-wrapper{position:relative;left:50%;transform:translate(-50%,0);transform:translate3d(-50%,0,0);transition:height .3s ease,padding .3s ease;padding:6px 0;will-change:transform,opacity}.coco-msg{padding:15px 21px;border-radius:3px;position:relative;left:50%;transform:translate(-50%,0);transform:translate3d(-50%,0,0);display:flex;align-items:center}.coco-msg-content,.coco-msg-icon,.coco-msg-wait{display:inline-block}.coco-msg-icon{position:relative;width:13px;height:13px;border-radius:100%;display:flex;justify-content:center;align-items:center}.coco-msg-icon svg{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:11px;height:11px}.coco-msg-wait{width:20px;height:20px;position:relative;fill:#4eb127}.coco-msg-wait svg{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.coco-msg-close{width:14px;height:14px}.coco-msg-content{margin:0 10px;min-width:240px;text-align:left;font-size:14px;font-weight:500;font-family:-apple-system,Microsoft Yahei,sans-serif;text-shadow:0 0 1px rgba(0,0,0,.01)}.coco-msg.info{color:#0fafad;background-color:#e7fdfc;box-shadow:0 0 2px 0 rgba(0,1,1,.01),0 0 0 1px #c0faf9}.coco-msg.info .coco-msg-icon{background-color:#0fafad}.coco-msg.success{color:#4ebb23;background-color:#f3ffe8;box-shadow:0 0 2px 0 rgba(0,1,0,.01),0 0 0 1px #d9f8bb}.coco-msg.success .coco-msg-icon{background-color:#4ebb23}.coco-msg.warning{color:#f1b306;background-color:#fff9eb;box-shadow:0 0 2px 0 rgba(1,1,0,.01),0 0 0 1px #fcf2cd}.coco-msg.warning .coco-msg-icon{background-color:#f1b306}.coco-msg.error{color:#f34b51;background-color:#fff7f7;box-shadow:0 0 2px 0 rgba(1,0,0,.01),0 0 0 1px #ffe3e3}.coco-msg.error .coco-msg-icon{background-color:#f34b51}.coco-msg.loading{color:#0fafad;background-color:#e7fdfc;box-shadow:0 0 2px 0 rgba(0,1,1,.01),0 0 0 1px #c2faf9}.coco-msg_loading{flex-shrink:0;width:20px;height:20px;position:relative}.coco-msg-circular{-webkit-animation:coco-msg-rotate 2s linear infinite both;animation:coco-msg-rotate 2s linear infinite both;transform-origin:center center;height:18px!important;width:18px!important}.coco-msg-path{stroke-dasharray:1,200;stroke-dashoffset:0;stroke:#0fafad;-webkit-animation:coco-msg-dash 1.5s ease-in-out infinite;animation:coco-msg-dash 1.5s ease-in-out infinite;stroke-linecap:round}@-webkit-keyframes coco-msg-rotate{100%{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes coco-msg-rotate{100%{transform:translate(-50%,-50%) rotate(360deg)}}@-webkit-keyframes coco-msg-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}100%{stroke-dasharray:89,200;stroke-dashoffset:-124px}}@keyframes coco-msg-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}100%{stroke-dasharray:89,200;stroke-dashoffset:-124px}}.coco-msg.info .coco-msg-wait{fill:#0fafad}.coco-msg.success .coco-msg-wait{fill:#4ebb23}.coco-msg.warning .coco-msg-wait{fill:#f1b306}.coco-msg.error .coco-msg-wait{fill:#f34b51}.coco-msg.loading .coco-msg-wait{fill:#0fafad}.coco-msg-pointer{cursor:pointer}@-webkit-keyframes coco-msg_info{0%{stroke:#0fafad}to{stroke:#0fafad;stroke-dasharray:0 100}}@keyframes coco-msg_info{0%{stroke:#0fafad}to{stroke:#0fafad;stroke-dasharray:0 100}}@-webkit-keyframes coco-msg_success{0%{stroke:#4eb127}to{stroke:#4eb127;stroke-dasharray:0 100}}@keyframes coco-msg_success{0%{stroke:#4eb127}to{stroke:#4eb127;stroke-dasharray:0 100}}@-webkit-keyframes coco-msg_warning{0%{stroke:#fcbc0b}to{stroke:#fcbc0b;stroke-dasharray:0 100}}@keyframes coco-msg_warning{0%{stroke:#fcbc0b}to{stroke:#fcbc0b;stroke-dasharray:0 100}}@-webkit-keyframes coco-msg_error{0%{stroke:#eb262d}to{stroke:#eb262d;stroke-dasharray:0 100}}@keyframes coco-msg_error{0%{stroke:#eb262d}to{stroke:#eb262d;stroke-dasharray:0 100}}.coco-msg-fade-in{-webkit-animation:coco-msg-fade .2s ease-out both;animation:coco-msg-fade .2s ease-out both}.coco-msg-fade-out{animation:coco-msg-fade .3s linear reverse both}@-webkit-keyframes coco-msg-fade{0%{opacity:0;transform:translate(-50%,0);transform:translate3d(-50%,-80%,0)}to{opacity:1;transform:translate(-50%,0);transform:translate3d(-50%,0,0)}}@keyframes coco-msg-fade{0%{opacity:0;transform:translate(-50%,0);transform:translate3d(-50%,-80%,0)}to{opacity:1;transform:translate(-50%,0);transform:translate3d(-50%,0,0)}}\n        ";
      _css.innerHTML = cssStr;

      if (head.children.length) {
        head.insertBefore(_css, head.children[0]);
      } else {
        head.appendChild(_css);
      }
    }
  }

  return cocoMessage;
});

设置css样式 

  body {
        margin: 0;
      }

      #test {
        margin: 0 auto;
        width: 1000px;
        height: calc(160vh - 100px);
        display: flex;
        justify-content: center;
        align-items: center;
      }
      #test button {
        margin: 0 20px;
      }
      .coco-btn {
        font-size: 14px;
        text-decoration: none;
        padding: 6px 20px;
        white-space: nowrap;
        border-radius: 5px;
        font-weight: 500;
        display: inline-block;
        cursor: pointer;
        border: 0;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        line-height: normal;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
      }
      .coco-btn.cancel {
        margin-right: 10px;
        color: #525456;
        background-color: transparent;
        font-weight: 500;
        transition: all 0.06s ease-out;
      }

      .coco-btn,
      .coco-btn span,
      .coco-loading {
        position: relative;
      }
      .coco-btn.ok {
        background-color: #0077ff;
        color: #fefefe;
      }
      .coco-btn.ok::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: inherit;
        transition: all 0.12s ease-out;
        background-color: transparent;
      }
      .coco-btn.ok:hover::before {
        background-color: rgba(255, 255, 255, 0.08);
      }
      .coco-btn.ok:active::before {
        transition: all 80ms ease-out;
        background-color: rgba(0, 0, 0, 0.2);
      }
      .github{
        font-weight: 600;
        text-align: center;
        margin-top: 100px;
      }

html布局 

 
    <div id="test">
      <button class="coco-btn ok">信息</button>
      <button class="coco-btn ok" >成功</button>
      <button class="coco-btn ok">警告</button>
      <button class="coco-btn ok">错误</button>
      <button class="coco-btn ok">加载</button>
      <button class="coco-btn ok">closeAll</button>
    </div>

script代码

 记得将上述的js代码文件也引入进来

  "use strict";

      cocoMessage.config({
        duration: 10000,
      });
      var btns = document.body.querySelectorAll(".coco-btn.ok");
 
      for (var i = 0; i < btns.length; i++) {
        addClickEvent(btns[i], i);
      }
      function addClickEvent(btn, i) {
        btn.addEventListener("click", function () {
          example(i);
        });
      }

      function example(n) {
        switch (n) {
          case 0:
            cocoMessage.info(3000, "请先登录！", function () {
              console.log("close");
            });
            break;

          case 1:
            var div1 = document.createElement("div");
            div1.innerText = "修改成功！";
            cocoMessage.success(div1);
            break;

          case 2:
            cocoMessage.warning("需要手动关闭", 0);
            break;

          case 3:
            cocoMessage.error("修改失败！", 3000);
            break;

          case 4:
            var closeMsg = cocoMessage.loading(true);
            setTimeout(function () {
              closeMsg();
            }, 4000);
            break;

          case 5:
            cocoMessage.destroyAll();
            break;

          default:
            break;
        }
      }

调用方式 

 以上所有均可这样调用设计消失时间

	// function success(){
		// 	cocoMessage.success(3000, "文本", function () {
		// 	    console.log("close");
		// 	});
		// }

展示效果 

 

 

代码真的养发
关注
Vue--》Vue3打造可扩展的项目管理系统后台的完整指南（一）
ztK63LrD的博客
05-23 1879
今天开始使用搭建一个项目管理的后台，因为文章会将项目的每一个地方代码的书写都会讲解到，所以本项目会分成好几篇文章进行讲解，我会在最后一篇文章中会将项目代码开源到我的上，大家可以自行去进行下载运行，希望本文章对有帮助的朋友们能多多关注本专栏，学习更多前端vue知识，然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面（：快速轻量且功能丰富的前端构建工具，帮助开发人员更高效构建现代Web应用程序。：高性能、轻量级npm替代品，帮助开发人员更加高效地处理应用程序的依赖关系。
Vue--》Vue3打造可扩展的项目管理系统后台的完整指南（五）
ztK63LrD的博客
06-15 704
今天开始使用 vue3 + ts 搭建一个项目管理的后台，因为文章会将项目的每一个地方代码的书写都会讲解到，所以本项目会分成好几篇文章进行讲解，我会在最后一篇文章中会将项目代码开源到我的GithHub上，大家可以自行去进行下载运行，希望本文章对有帮助的朋友们能多多关注本专栏，学习更多前端vue知识。
微信小程序反编译之后运行报错“_typeof3 is not a function”
weixin_39114917的博客
06-04 951
微信小程序解包之后，在微信开发者工具当中点开调试器，选择Console选项卡，发现左侧的预览界面是空白的，虽然真机调试可以有显示，但是真机预览也是跟左边的界面一样都是空白。之后发现Console里面显示。替换之后重新编译如果还有报错：_typeof4 is not a function。解决方法：右上角点击“详情”=>“本地设置”=>“将JS编译成ES5”=>取消勾选。\runtime\helpers\typeof.js 整个代码替换掉。然后重新编辑，问题解决！解决方法： 修改一下 @
gulp babel转义typeof方法异常
weixin_45152848的博客
01-21 522
程序中定义了一个copy对象的的方法 function clone(obj) { if (null == obj || "object" != typeof obj) return obj; if (obj instanceof Date) { var copy = new Date(); copy.setTime(obj.getTime()); return copy; } if (obj instanceof Array)
Module build failed: Error: Cannot find module ‘babel-runtime/helpers/typeof‘ ，已解决
weixin_44012027的博客
03-16 2410
一边当舔狗一边写前端，发现安装了个插件之后， npm run dev 启动Vue报错了 错误如下 ERROR Failed to compile with 1 errors 22:32:26 error in ./src/main.js Module build failed: Error: Cannot find module 'babel-runt
关于ES6中子类继承的实现原理逐行解析
wdadadadada123的博客
04-30 1964
JS中万物皆对象 所以到了es6对一个对象生成器（构造函数）也定义了新的写法——类（class）使之写法和面向对象的写法更像 现如今我们定义一个一个构造函数就是定义一个类，写法如下： class Parent { constructor(name,age){ this.name = name; this.age = age; } sa...
Uncaught Error: Cannot find module ‘babel-runtime/helpers/typeof‘
liuwen_jing的博客
07-12 1461
node包出问题解决办法
vue3+ts后台管理项目
07-04
综上所述，Vue3结合TS可以实现一个高效和可维护的后台管理项目。通过使用Composition API、享受Vue3的性能提升以及借助Vue3的开发工具和生态系统，我们可以开发出一个功能强大、用户体验优秀的后台管理系统。
HTML期末作业-基于HTML+CSS+JavaScript制作学生信息管理系统模板
HTML网页设计
08-04 2924
🧑‍🎓 学生管理系统网页设计 、OA管理系统、后台管理模板、智能停车系统、等网站的设计与制作。🏷️HTML网页设计，采用DIV+CSS布局，共有多个页面，排版整洁，内容丰富，主题鲜明，首页使用CSS排版比较丰富，色彩鲜明有活力，导航与正文字体分别设置不同字号大小。导航区域设置了背景图。子页面有纯文字页面和图文并茂页面。🏅 一套优质的💯网页设计应该包含 (具体可根据个人要求而定)📔网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。📓网站程序方面：计划采用最新......
基于SpringBoot的商品管理后台ERP系统——商品管理模块
qq1744828575的博客
11-22 2324
随着我国互联网的普及率不断提高，以及物流货运行业的逐渐兴起，人们对电子交易模式进行交易活动和相关服务活动这些业务需求也在不断增长，衍生了大量的第三方交易平台，使得许多电子商务企业得到了突飞猛进式的发展。与此同时，成千上万的商品信息被存储进了这些企业的数据库里面，如何去围绕商品的各种信息来促进订单的合理管理，成为电商企业需要考虑的问题之一。
小程序反编译 代码报错_typeof3 is not a function
悟空—
03-09 3834
修改一下 @babel\runtime\helpers\typeof.js function _typeof2(o) { "@babel/helpers - typeof"; return (_typeof2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) { return typeof o; } : function(o) { re..
反编译微信小程序，win电脑解析获取微信小程序源码
ts小陈的博客
05-17 1945
好不容易写的小程序然后忘记保存被删了怎么办？不要慌这里就教你怎么搞。 环境准备 1、node 环境准备 Node下载地址 安装后将nodejs设置为环境变量。 打开cmd，测试是否安装成功：在命令行输入node -v 出现版本号说明已经安装成功。 2、反编译工具 反编译软件下载 下载下来解压到某个位置就可以了，下面有操作方式 具体操作 1、先用电脑版微信打开一下小程序 打开你的微信安装位置（可以查看微信设置文件管理），然后找到缓存到本地的小程序包路径，一般都是在微信PC安装目录
微信小程序逆向重打包：_typeof3 is not a function
uiop_uiop_uiop的博客
02-11 6044
在将上一篇博文中反编译的小程序解包之后，在微信开发者工具当中点开调试器，选择Console选项卡，发现左侧的预览界面是空白的，虽然真机调试可以有显示，但是真机预览也是跟左边的界面一样都是空白。之后发现Console里面显示： app.js错误: TypeError: _typeof3 is not a function 查阅资料找到 @babel/runtime/helpers/typeof.js 原先的文件内容是： //这里是有问题的程序 function _typeof(o) {
babel 如何转义extends
花神的博客
05-25 965
接着上一篇文章，我们继续进行extends的解析。 开始之前，我们先要回顾一下ES5的继承，以前实现继承也不是一件容易的事情，常用的方法有构造函数继承，原型继承，组合继承，寄生式继承和寄生组合式继承等，构造函数继承中每个子类的属性和方法都是独立，太浪费内存，原型继承虽然实现了方法的共享，但是存在子类修改公共方法，影响其他子类的问题等，那么babel是如何来处理继承的呢，接下来我们通过babel官网提供的工具看一下： // 原始代码 class Father { name = 'iwen' a
Vue--》Vue3打造可扩展的项目管理系统后台的完整指南（十）
ztK63LrD的博客
07-08 442
今天开始使用搭建一个项目管理的后台，因为文章会将项目的每一个地方代码的书写都会讲解到，所以本项目会分成好几篇文章进行讲解，我会在最后一篇文章中会将项目代码开源到我的上，大家可以自行去进行下载运行，希望本文章对有帮助的朋友们能多多关注本专栏，学习更多前端vue知识，然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面（：快速轻量且功能丰富的前端构建工具，帮助开发人员更高效构建现代Web应用程序。：高性能、轻量级npm替代品，帮助开发人员更加高效地处理应用程序的依赖关系。
Vue--》从零开始打造交互体验一流的电商平台（一）
ztK63LrD的博客
05-06 546
今天开始使用搭建一个电商项目平台，因为文章会将项目的每处代码的书写都会讲解到，所以本项目会分成好几篇文章进行讲解，我会在最后一篇文章中会将项目代码开源到我的上，大家可以自行去进行下载运行，希望本文章对有帮助的朋友们能多多关注本专栏，学习更多前端vue知识，然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面（：快速轻量且功能丰富的前端构建工具，帮助开发人员更高效构建现代Web应用程序。：高性能、轻量级npm替代品，帮助开发人员更加高效地处理应用程序的依赖关系。
小程序ReferenceError: define is not defined at eval (weapp:///@babel/runtime/helpers/typeof.js:1)
weixin_57098738的博客
03-02 2011
小程序ReferenceError: define is not defined at eval (weapp:///@babel/runtime/helpers/typeof.js:1)
3.babel@7.9.0学习总结
l_b_c的博客
05-16 424
1.今天继续学习剩下的几个babel对外开放的几个api（Tools） @babel/generator 此工具依赖需要自行安装 npm install --save-dev @babel/generator
跟着尚硅谷学vue2—进阶版2.0—使用 Vue 脚手架1.0
最新发布
zhzijun的博客
11-13 384
分析脚手架 、ref和props、mixin混入、插件、scoped样式、总结TodoList案例、浏览器本地存储-webStorage、TodoList_本地存储
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

代码真的养发

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值