{"slug":"loadingoverlay","mode":"single","examples":[{"id":"loadingoverlay-ex-1","title":"切换全屏遮罩","titleSrc":"demo","desc":"","html":"<button onclick=\"toggleFull()\">切换全屏遮罩</button>\n<div class=\"kole-box\">\n  局部内容区域\n  <button style=\"margin-top:8px\" onclick=\"toggleInline()\">切换局部遮罩</button>\n  <div class=\"kole-loading-overlay is-inline\" id=\"inline\" role=\"status\" style=\"display:none\" aria-busy=\"true\">\n    <div class=\"kole-loading-spinner\" role=\"status\" aria-busy=\"true\"></div>\n    <div class=\"kole-loading-text\" aria-busy=\"true\">加载中…</div>\n  </div>\n</div>\n<div class=\"kole-loading-overlay is-dark\" id=\"full\" role=\"status\" style=\"display:none\" aria-busy=\"true\">\n  <div class=\"kole-loading-spinner\" role=\"status\" aria-busy=\"true\"></div>\n  <div class=\"kole-loading-text\" aria-busy=\"true\">正在提交，请稍候</div>\n</div>","preview":{"show":[[0],[1],[2]],"hide":[],"mode":"single"},"previewSafe":true,"previewUnsafeReasons":[],"source":"demo-mapped","code":{"html":"<button onclick=\"toggleFull()\">切换全屏遮罩</button>\n<div>\n  局部内容区域\n  <button style=\"margin-top:8px\" onclick=\"toggleInline()\">切换局部遮罩</button>\n  <div class=\"kole-loading-overlay is-inline\" role=\"status\" style=\"display:none\" aria-busy=\"true\">\n    <div class=\"kole-loading-spinner\" role=\"status\" aria-busy=\"true\"></div>\n    <div class=\"kole-loading-text\" aria-busy=\"true\">加载中…</div>\n  </div>\n</div>\n<div class=\"kole-loading-overlay is-dark\" role=\"status\" style=\"display:none\" aria-busy=\"true\">\n  <div class=\"kole-loading-spinner\" role=\"status\" aria-busy=\"true\"></div>\n  <div class=\"kole-loading-text\" aria-busy=\"true\">正在提交，请稍候</div>\n</div>","jsx":"import { KoleLoadingOverlay } from 'kole-ui/react';\n\n<>\n<KoleLoadingOverlay role=\"status\" aria-busy=\"true\">加载中…</KoleLoadingOverlay>\n<KoleLoadingOverlay dark role=\"status\" aria-busy=\"true\">正在提交，请稍候</KoleLoadingOverlay>\n</>","vue3":"import { KoleLoadingOverlay } from 'kole-ui/vue3';\n\n<template>\n<KoleLoadingOverlay role=\"status\" aria-busy=\"true\">加载中…</KoleLoadingOverlay>\n<KoleLoadingOverlay dark role=\"status\" aria-busy=\"true\">正在提交，请稍候</KoleLoadingOverlay>\n</template>","vue2":"import { KoleLoadingOverlay } from 'kole-ui/vue2';\n\n<template>\n<KoleLoadingOverlay role=\"status\" aria-busy=\"true\">加载中…</KoleLoadingOverlay>\n<KoleLoadingOverlay dark role=\"status\" aria-busy=\"true\">正在提交，请稍候</KoleLoadingOverlay>\n</template>"},"notes":[]}]}