H5 控制台-实战 2

使用VConsole实现控制台功能

<script setup>
import { onMounted } from "vue";
const initVConsole = () => {
  const script = document.createElement("script");
  script.src = "//cdn.bootcss.com/vConsole/3.3.4/vconsole.min.js";
  document.body.append(script);
  script.onload = function () {
    window.vConsole = new VConsole();
    console.log("vConsole inited 控制台已打开...", window.vConsole);
  };
};

onMounted(initVConsole);
</script>

测试VConsole实现控制台功能

测试代码

init

const init = () => {
  if (window.vConsole) {
    window.vConsole.destroy();
  }
  window.vConsole = new VConsole();
};

show

const show = () => {
  window.vConsole.show();
};

hide

const hide = () => {
  window.vConsole.hide();
};

destroy

const destroy = () => {
  window.vConsole.destroy();
};