Research
Recent Trends in Malicious Packages Targeting Discord
The Socket research team breaks down a sampling of malicious packages that download and execute files, among other suspicious behaviors, targeting the popular Discord platform.
vue3-page-split
Advanced tools
Readme
基于 Vue3 的可拖拉缩放的分割面板
English | 简体中文
$ npm i vue3-page-split -S
在 Vue 项目中使用 PageSplit
<template>
<SplitPane
:distribute="0.5"
:lineThickness="6"
:isVertical="false"
@resizeLineStartMove="onresizeLineStartMove"
@resizeLineMove="onResizeLineMove"
@resizeLineEndMove="onresizeLineEndMove"
>
<template v-slot:first>
<h1>A</h1>
</template>
<template v-slot:second>
<h1>B</h1>
</template>
</SplitPane>
</template>
<script>
import PageSplit from "vue3-page-split";
import "vue3-page-split/dist/style.css";
export default {
components: {
SplitPane
},
methods: {
onresizeLineStartMove: function() {
console.log("onresizeLineStartMove");
},
onResizeLineMove: function(e) {
console.log("onResizeLineMove :>> ", e);
},
onresizeLineEndMove: function() {
console.log("onresizeLineEndMove");
}
}
};
</script>
属性名 | 类型 | 默认值 | 说明 |
---|---|---|---|
distribute | Number | 0.5 | 面板比例,取值范围 0~1 |
isVertical | Boolean | true | 切割模式(true:垂直切割,false:水平切割) |
lineThickness | Number | 6 | 分割线的宽度 |
hasLineTip | Boolean | true | 分割线中是否有三条杠 |
backgroundColor | String | "#a0cfff" | 分割线的背景颜色 |
hoverColor | String | "#409eff" | 分割线的鼠标hover后的颜色 |
hasBoxShadow | Boolean | true | 分割线是否有box-shadow样式 |
firstMinValue | Number | 0 | 左组件/上组件的最小宽度/高度,必须>=0 |
secondMinValue | Number | 0 | 右组件/下组件的最小宽度/高度,必须>=0 |
isFirstComponentMasked | Boolean | false | 左组件/上组件是否需要遮挡层 |
isSecondComponentMasked | Boolean | false | 右组件/下组件是否需要遮挡层 |
备注:遮挡层用于捕获鼠标事件,主要在组件内包含iframe时使用,因为iframe会“吞噬”鼠标事件
本组件会触发3个事件:
事件名 | 说明 | 返回值 |
---|---|---|
resizeLineStartMove | 拖拽开始 | - |
resizeLineMove | 拖拽中 | event对象 |
resizeLineEndMove | 拖拽结束 | - |
如果图片加载不出,请到 Homepage 或 Repository 查看
FAQs
基于 Vue3 的面板分割
We found that vue3-page-split demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
The Socket research team breaks down a sampling of malicious packages that download and execute files, among other suspicious behaviors, targeting the popular Discord platform.
Security News
Socket CEO Feross Aboukhadijeh joins a16z partners to discuss how modern, sophisticated supply chain attacks require AI-driven defenses and explore the challenges and solutions in leveraging AI for threat detection early in the development life cycle.
Security News
NIST's new AI Risk Management Framework aims to enhance the security and reliability of generative AI systems and address the unique challenges of malicious AI exploits.