4.9k 4 分钟

Vue.Draggable 是一款基于 Sortable.js 拖拽插件

# 一、特点

  1. 完全支持 Sortable.js 的功能支持触摸设备支持拖拽和选择文本智能自动滚动支持在不同列表之间拖拽没有 JQuery 依赖项
  2. 与视图模型同步刷新
  3. 与 Vue2 动画兼容
  4. 支持撤销操作
  5. 当需要完全控制时,可抛出所有的变化事件
  6. 与现有的 UI 组件兼容(比如 vuetify、element、vue material 等)

7.1k 6 分钟

# 一、父传子

思路:父组件通过冒号:绑定变量,然后子组件用 const props = defineProps({}) 进行接收参数。

父组件代码: 在第二行那里 :name="name" 把那么传给子组件

<template>
  <child :name="name"></child>
</template>
<script setup>
import { ref } from 'vue'
import child from './child.vue'
const name = ref('天天鸭')
</script>

子组件代码: const props = defineProps({}) 接收后直接在标签使用

<template>
  <div></div>
</template>
<script setup>
import { defineProps } from 'vue'
const props = defineProps({
  name: {
    type: String,
    default: '',
  },
})
</script>

2.6k 2 分钟

在 Vue 3 中,监听 sessionStorage 的变化可以通过几种方式实现,但值得注意的是,原生 sessionStorage 事件并不直接支持变化监听。这意味着你不能直接像监听 window.localStorage 那样使用 storage 事件来监听 sessionStorage 的变化。不过,你可以通过轮询(polling)或者使用 Proxy 对象来间接实现监听。 # 方法 1:使用轮询(Polling) 轮询是一种简单的方法,通过定期检查 sessionStorage 的内容是否发生变化来实现。 &lt;script setup>import...
1.1k 1 分钟

# 啥是时区?

时区是地球上的区域使用同一个时间定义。以前,人们通过观察太阳的外置(时角)决定时间,这就使得不同经度的地方的时间各有不同,为了统一使用同一个时间,就引入了时区的概念。时区通过设立一个标准时间部分地解决了这个问题。世界各国位于地球的不同位置,因此不同国家,特别是东西跨度大的国家日出、日落时间必定有偏差,这些偏差就是时差。

# 表示

协调世界时(UTC)是最主要的世界时间标准,其以院子时秒长为基础,在时刻上尽量接近于格林威治标准时间。协调世界时是世界上调调节时钟和时间的主要标准。如果时间是以协调世界时(UTC)表示,则在时间后面加上 “Z”,“Z” 是协调世界时中 0 时区的标志。UTC 时间也叫祖鲁时间,因为在北约音标字母中用 “Zulu” 表示 “Z”。
UTC 偏移量的表示形式为:±[hh]:[mm]、±[hh][mm] 或者 ±[hh]。比如北京时间比协调世界时(UTC)早八小时,那么应当表示为:UTC+8。

JavaScript 获得当前客户端的时区
对象是 ECMAScript 国际化 API 的一个命名空间,它提供了精确的字符串对比、数字格式化和日期格式化。我们需要使用这个 API 的 DateTimeFormat 对象。具体可以参考:MDN Intl.DateTimeFormat

获得客户端当前时区:

Intl.DateTimeFormat().resolvedOptions().timeZone // 'Asia/Shanghai'

1.8k 2 分钟

在 JavaScript 中,进行精确的类型检查通常涉及使用 typeof 运算符和 instanceof 关键字。以下是一些实用的函数和方法,用于进行精确的类型检验:

  1. 使用 typeof 检查原始类型(例如: string , number , boolean )。
  2. 使用 instanceof 检查对象的类型,特别是检查某个实例是否是构造函数的实例。
  3. 使用 Array.isArray() 检查数组类型。
  4. 使用 typeofObject.prototype.toString.call() 结合,检查复杂类型(例如: function , object , symbol , bigint )。

1.6k 1 分钟

// 判断标准:窗口高度 + 滚动条位置 >= 页面高度/* -------------------------------------------- */// 原生 JS 判断整个文档滚动至底部window.onscroll = ()=>&#123; // 窗口高度 var windowHeight = document.documentElement.clientHeight || document.body.clientHeight; // 页面高度 var documentHeight = document.documentElement.scrollHeight...