Skip to content
本页目录

逻辑操作

路由跳转

js
this.$router.push('pageId')

移动端调试Vconsole

js
this.$js("VConsole", "https://cdn.bootcdn.net/ajax/libs/vConsole/3.15.1/vconsole.min.js").then((VConsole) => {
  new VConsole()
})

移动端异步加载element

js
this.$css('/czdn/js/element-ui.css')
this.$js("element", "/czdn/js/element-ui.js").then((element) => {})

弹窗

js
this.$dialog({
    // 弹窗标题
    title: "对话框标题",
    // 弹窗宽度,UI规范可选值:480px 720px 1200px 1600px
    width: "1024px",
    // 全屏
    fullscreen: false, 
    // 距离顶部的边距
    top: "15vh",
    // 遮罩
    modal: true,
    // 遮罩层是否插入至 body 元素上
    modalAppendToBody: true,
    // Dialog 自身是否插入至 body 元素上
    appendToBody: true,
    // 是否在 Dialog 出现时将 body 滚动锁定
    lockScroll: true,
    // Dialog 的自定义类名
    customClass: "",
    // 是否可以通过点击 modal 关闭 Dialog
    closeOnClickModal: true,
    // 是否可以通过按下 ESC 关闭 Dialog
    closeOnPressEscape: true,
    // 是否显示关闭按钮
    showClose: true,
    // 关闭前的回调,会暂停 Dialog 的关闭
    // beforeClose: ()=>{},
    // 是否对头部和底部采用居中布局
    center: false,
    // 关闭时销毁 Dialog 中的元素
    destroyOnClose: false,
    // 必填项,勿删
    noBindOptions: true,
},"UIBlock", {
    //待打开的页面或组件标识
    code: "chart-test",
    //传递的数据对象,在组件中通过props:['opts']声明
    opts: {}
}).then((res) => {
    // 打开的页面关闭时数据通过$emit('close',数据)传递给res

});

如何设置不带标题行的弹窗

前置条件:比如满足非嵌套弹窗,即这个弹窗是直接从页面弹出的

弹窗配置修改:appendToBody: false, customClass: "noHeader",

页面高级样式的样式表代码中添加

css
>>> .noHeader .el-dialog__header{
  display: none;
}

抽屉

js
this.$drawer(
  {
    // 自身是否插入至 body 元素上
    appendToBody: true,
    // 关闭前的回调
    // beforeClose: ()=>{},
    // 是否可以通过按下 ESC 关闭
    closeOnPressEscape: true,
    // 自定义类名
    customClass: "",
    // 控制是否在关闭 Drawer 之后将子元素全部销毁
    destroyOnClose: false,
    // 是否需要遮罩层
    modal: true,
    // 遮罩层是否插入至 body 元素上
    modalAppendToBody: true,
    // 弹窗方向 	rtl / ltr / ttb / btt
    direction: "rtl",
    // 是否显示关闭按钮
    showClose: true,
    // 抽屉尺寸,UI规范可选值:720px 1200px 1600px
    size:"850px",
    // 标题
    title: "抽屉标题",
    // 点击遮罩层是否可以关闭 Drawer
    wrapperClosable: true,
    // 是否显示 header 栏
    withHeader: true,
  }, "UIBlock", {
    //待打开的页面或组件标识
    code: "chart-test",
    //传递的数据对象,在组件中通过props:['opts']声明
    opts: {}
  }
).then((res) => {
  // 打开的页面关闭时数据通过$emit('close',数据)传递给res
    
});

定时器

js
// 1秒后执行
setTimeout(()=>{

}, 1000)

// 每隔1秒执行
var clock = setInterval(()=>{

}, 1000)

// 清除定时器
clearInterval(clock)

内部资料,请勿外传