使用方法：
傳入字段：
type:非必須 型別 水平方向 level 垂直方向 vertical 預設 level
fromname：必須，唯一的值，與專案其他地方使用的值保證不一樣
minimum:非必須：最小縮放寬度
直接貼**：
"box"
>
'type === "level"'
>
"left"
:style=
"resleft?'width:0vw':''"
>
<
/slot>
<
/div>
"resize"
>
'!resleft'
class
="resimg" @click=
"handleressize()" src=
'@/assets/stop.png'
/>
else
class
="resimg" @click=
"handleressize()" src=
'@/assets/open.png'
/>
<
/div>
"right"
:style=
"resleft?'width:calc(100vw - 3px)':''"
>
<
/slot>
<
/div>
<
/template>
'type === "vertical"'
>
"top"
>
<
/slot>
<
/div>
"resize2"
>
<
/div>
"bottom"
>
<
/slot>
<
/div>
<
/template>
<
/div>
<
/template>
import
from
'../../utils/localstorage'
export
default
, fromname:
, minimum:},
data()
},mounted()
elseif(
this
.type ===
"vertical")}
, methods:)}
},dragcontrollerdivw()
=getlocal
('movewidth'
+this
.fromname)
console.
log(
'leftwidth'
, leftwidth)
resize.style.left = leftwidth;
// 側邊欄的居左
left.style.width = leftwidth +
"px"
;// 左側盒子寬度
right.style.width = rigthwidth +
"px"
;// 右側盒子寬度
} resize.
onmousedown
=function
(e))
} document.
onmouseup
=function()
resize.setcapture && resize.
setcapture()
;return
false;}
},dragcontrollerdivh()
=getlocal
('moveheight'
+this
.fromname)
resize.style.left = leftheight;
// 側邊欄的居左
top.style.height = leftheight +
"px"
;// 左側盒子寬度
bottom.style.height = rigthheight +
"px"
;// 右側盒子寬度
} resize.
onmousedown
=function
(e))
} document.
onmouseup
=function()
resize.setcapture && resize.
setcapture()
;return
false;}
}}}<
/script>
#box
#resize
#resize2
#left
#right
#top
#bottom
.resimg
<
/style>有問題聯絡我哦
邏輯題 假設河的同一側有警察 強盜
假設河的同一側有警察 強盜 路人a 路人a的兩個孩子 a1，a2 路人b 路人b的兩個孩子 b1 b2 他們想要安全過河，限制條件如下 1 假設警察不在，強盜會殺死所有的跟他在一起的人 2 假設路人a離開，路人b和路人a的孩子在一起，路人a的孩子會死掉 3 假設路人b離開，路人a和路人b的孩子在一起...
利用向量計算快速判定一點在直線的哪一側
很實用的一片判斷點與直線關係的文章，這個例子是用來說明向量運算可以快速判定一點在直線的哪一側。如上圖所示，直線是從pa到pb的直線ab。下面的工作是構建乙個方法，來判斷某點在這條直線ab的左下側還是右上側。如上圖所示，pc點就在直線ab的右上側，而pd點就在直線ab的左下側。這裡要用向量運算來解決這...
HTML DOM生成乙個可以拖拽的元素
假設我們想對下面這個元素進行拖拽 dragme class draggable drag mediv 修改css draggable 為了讓其可以被拖拽，我們需要處理三個事件 滑鼠的當前位置 let x 0 let y 0 找到要拖拽的元素 const ele document.getelement...