vue---splitpane分割
使用splitpane可以对窗口进行拆分,这个splitpane组件还是比较好用的,
首先安装:
npm install vue-splitpane
引入使用:
import splitPane from 'vue-splitpane'
Vue.component('split-pane', splitPane);
分割成两列:
<split-pane v-on:resize="resize" :min-percent='' :default-percent='' split="vertical">
<template slot="paneL">
A
</template>
<template slot="paneR">
B
</template>
</split-pane>
分割成三列:
<split-pane v-on:resize="resize" :min-percent='' :default-percent='' split="vertical">
<template slot="paneL">
A
</template>
<template slot="paneR">
<split-pane split="horizontal">
<template slot="paneL">
B
</template>
<template slot="paneR">
C
</template>
</split-pane>
</template>
</split-pane>
参考文档:https://www.npmjs.com/package/vue-splitpane
vue---splitpane分割的更多相关文章
- Vue代码分割懒加载的实现方法
什么是懒加载 懒加载也叫延迟加载,即在需要的时候进行加载,随用随载. 为什么需要懒加载 在单页应用中,如果没有应用懒加载,运用webpack打包后的文件将会异常的大,造成进入首页时,需要加载的内容过多 ...
- 大白话Vue源码系列(03):生成AST
阅读目录 AST 节点定义 标签的正则匹配 解析用到的工具方法 解析开始标签 解析结束标签 解析文本 解析整块 HTML 模板 未提及的细节 本篇探讨 Vue 根据 html 模板片段构建出 AST ...
- 【javaFX学习】(二) 面板手册--1
找了好几个资料,没找到自己想要的,自己写个列表吧,方便以后用的时候挑选,边学边记.以学习笔记为主,所以会写的会偏个人记忆性.非教程,有什么问题一起讨论啊. 各个不同的控件放入不同的面板中有不同的效果, ...
- JAVAFX-6 面板总结
说明:转至:https://www.cnblogs.com/lensener/p/7978225.html 便于集中看到这些文章 面板列表: Accordion 手风琴面板:就是一个折叠展开功能,一般 ...
- Webpack 打包优化之体积篇
谈及如今欣欣向荣的前端圈,不仅有各类框架百花齐放,如Vue, React, Angular等等,就打包工具而言,发展也是如火如荼,百家争鸣:从早期的王者Browserify, Grunt,到后来赢得宝 ...
- 【javaFX学习】(二) 面板手册
移至http://blog.csdn.net/qq_37837828/article/details/78732591 更新 找了好几个资料,没找到自己想要的,自己整理下吧,方便以后用的时候挑选,边学 ...
- 王下邀月熊_Chevalier的前端每周清单系列文章索引
感谢 王下邀月熊_Chevalier 分享的前端每周清单,为方便大家阅读,特整理一份索引. 王下邀月熊大大也于 2018 年 3 月 31 日整理了自己的前端每周清单系列,并以年/月为单位进行分类,具 ...
- 在webpack中使用Code Splitting--代码分割来实现vue中的懒加载
当Vue应用程序越来越大,使用Webpack的代码分割来懒加载组件,路由或者Vuex模块, 只有在需要时候才加载代码. 我们可以在Vue应用程序中在三个不同层级应用懒加载和代码分割: 组件,也称为异步 ...
- vue或者js中平均分割数组
vue中 把一段长数组按照指定份数 均分 sliceArray(array, size) { var result = []; for (var x = 0; x < Math.ceil(arr ...
随机推荐
- 二、Linux_系统信息查看
系统信息查看 1. Linux查看cpu核数等信息: [root@tdh01 ~]# grep 'physical id' /proc/cpuinfo | sort -u # 查看物理cpu个数 ph ...
- PostgreSQL日志分析工具
PostgreSQL日志分析工具 postgresqllinux PostgreSQL日志审计可以配合 pgbench.jmeter...测试工具制定测试计划测试性能,由于日志审计比较影响性能,在不需 ...
- CVE-2019-0193:Apache Solr 远程命令执行漏洞复现
0x00 漏洞背景 2019年8月1日,Apache Solr官方发布了CVE-2019-0193漏洞预警,漏洞危害评级为严重 0x01 影响范围 Apache Solr < 8.2.0 0x0 ...
- linux卸载及安装mysql 5.7以上
删除: 1.rpm -qa|grep -i mysql 查看安装的mysql 2./usr/local/mysql/support-files/mysql.server stop 停止mys ...
- golang gomobile 环境搭建
1. 安装Go语言SDK https://www.golangtc.com/download 2. 配置系统变量这建立GOROOT和GOPATH两个目录,分别对应sdk所在目录与项目文件根目录 3. ...
- Thinkphp下记录和统计时间(微秒)和内存使用情况
* 记录和统计时间(微秒)和内存使用情况 * 使用方法: * <code> * G('begin'); // 记录开始标记位 * // ... 区间运行代码 * G('end'); // ...
- luoguU60884 【模板】动态点分治套线段树
题目连接:https://www.luogu.org/problemnew/show/U60884 题意:有N个点,标号为1∼N,用N−1条双向带权通道连接,保证任意两个点能互相到达. Q次询问,问从 ...
- LINUX部署JAVA项目
Tomcat 应用服务器搭建好 安装 tomcat 所需依赖或工具软件 sudo yum -y update sudo yum -y install wget java unzip 使用 wget 下 ...
- git merge与git rebase区别(转载)
这是最近看的讲的比较通俗易懂的rebase与merge的区别了 https://www.jianshu.com/p/4079284dd970
- python的多线程是否没有用了
python的多线程是否就完全没有用了呢? 相同的代码,为何有时候多线程会比单线程慢,有时又会比单线程快? 这主要跟运行的代码有关: 1. CPU密集型代码 (各种循环处理.计数等等 ),在这种情况下 ...