Merge branch 'main' of https://github.com/vbenjs/vue-vben-admin into dev
This commit is contained in:
@@ -31,12 +31,11 @@ export default defineComponent({
|
||||
if (props.renderBr && isString(props.content)) {
|
||||
const lines = props.content.split('\n');
|
||||
const result = [];
|
||||
for (let i = 0; i < lines.length; i++) {
|
||||
const line = lines[i];
|
||||
result.push(h('span', { key: i }, line));
|
||||
if (i < lines.length - 1) {
|
||||
result.push(h('br'));
|
||||
}
|
||||
for (const [i, line] of lines.entries()) {
|
||||
result.push(h('p', { key: i }, line));
|
||||
// if (i < lines.length - 1) {
|
||||
// result.push(h('br'));
|
||||
// }
|
||||
}
|
||||
return result;
|
||||
} else {
|
||||
|
@@ -39,6 +39,14 @@ const isAtRight = ref(false);
|
||||
const isAtBottom = ref(false);
|
||||
const isAtLeft = ref(true);
|
||||
|
||||
/**
|
||||
* We have to check if the scroll amount is close enough to some threshold in order to
|
||||
* more accurately calculate arrivedState. This is because scrollTop/scrollLeft are non-rounded
|
||||
* numbers, while scrollHeight/scrollWidth and clientHeight/clientWidth are rounded.
|
||||
* https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollHeight#determine_if_an_element_has_been_totally_scrolled
|
||||
*/
|
||||
const ARRIVED_STATE_THRESHOLD_PIXELS = 1;
|
||||
|
||||
const showShadowTop = computed(() => props.shadow && props.shadowTop);
|
||||
const showShadowBottom = computed(() => props.shadow && props.shadowBottom);
|
||||
const showShadowLeft = computed(() => props.shadow && props.shadowLeft);
|
||||
@@ -60,14 +68,18 @@ function handleScroll(event: Event) {
|
||||
const target = event.target as HTMLElement;
|
||||
const scrollTop = target?.scrollTop ?? 0;
|
||||
const scrollLeft = target?.scrollLeft ?? 0;
|
||||
const offsetHeight = target?.offsetHeight ?? 0;
|
||||
const offsetWidth = target?.offsetWidth ?? 0;
|
||||
const clientHeight = target?.clientHeight ?? 0;
|
||||
const clientWidth = target?.clientWidth ?? 0;
|
||||
const scrollHeight = target?.scrollHeight ?? 0;
|
||||
const scrollWidth = target?.scrollWidth ?? 0;
|
||||
isAtTop.value = scrollTop <= 0;
|
||||
isAtLeft.value = scrollLeft <= 0;
|
||||
isAtBottom.value = scrollTop + offsetHeight >= scrollHeight;
|
||||
isAtRight.value = scrollLeft + offsetWidth >= scrollWidth;
|
||||
isAtBottom.value =
|
||||
Math.abs(scrollTop) + clientHeight >=
|
||||
scrollHeight - ARRIVED_STATE_THRESHOLD_PIXELS;
|
||||
isAtRight.value =
|
||||
Math.abs(scrollLeft) + clientWidth >=
|
||||
scrollWidth - ARRIVED_STATE_THRESHOLD_PIXELS;
|
||||
|
||||
emit('scrollAt', {
|
||||
bottom: isAtBottom.value,
|
||||
|
Reference in New Issue
Block a user