其它实用程序

打开外部URL

import { openURL } from 'quasar'

openURL('http://...')

它将处理在Cordova或浏览器下运行时涉及的怪异行为,包括通知用户他/她必须确认打开弹出窗口。

去抖(Debounce)函数

如果您的应用程序使用JavaScript来完成繁重的任务,那么去抖函数对于确保给定任务不会频繁触发以至于阻碍浏览器性能至关重要。去抖函数会限制函数的触发速率。

Debouncing强制一个函数不会被再次调用,直到经过一段时间而没有被调用。 正如“只有经过100毫秒而未被调用才执行此功能”。

一个简单的例子:在窗口上有一个调整大小的监听器,它执行一些元素尺寸计算并(可能)重新定位一些元素。 这本身并不是一项繁重的任务,但是经过多次调整后反复触发,真的会减慢你的App速度。 那么为什么不限制函数可以触发的速率呢?

// 返回一个函数,只要它继续被调用,就不会被触发。
// 该函数在停止被调用N毫秒后将被调用。
// 如果传递`immediate`,则立即触发该函数
// 而不是拖延。
import { debounce } from 'quasar'

(Debounced Function) debounce(Function fn, Number milliseconds_to_wait, Boolean immediate)

// Example:
window.addEventListener(
'resize',
debounce(function() {
.... things to do ...
}, 300 /*等待的毫秒*/)
)

还有一个frameDebounce可用,它会延迟调用你的函数,直到下一个浏览器框架计划运行(阅读requestAnimationFrame)。

import { frameDebounce } from 'quasar'

(Debounced Function) frameDebounce(Function fn)

// Example:
window.addEventListener(
'resize',
frameDebounce(function() {
.... things to do ...
})
)

节流(Throttle)功能

节流限制一定时间内一个函数可调用的最大次数。 如“每X毫秒最多执行一次该功能”。

import { throttle } from 'quasar'

(Throttled Function) throttle(Function fn, Number limit_in_milliseconds)

// 例子:
window.addEventListener(
'resize',
throttle(function() {
.... things to do ...
}, 300 /* 每0.3s最多执行一次 */)
)

(深)复制对象

和“jQuery.extend()`基本相同的方法。 采用相同的参数:

import { extend } from 'quasar'

let newObject = extend([Boolean deepCopy], targetObj, obj, ...)

注意对象内的方法。

生成UID

生成唯一标识符:

import { uid } from 'quasar'

let uid = uid()
// 例如: 501e7ae1-7e6f-b923-3e84-4e946bff31a8

处理DOM事件处理程序中的“事件”

它是跨浏览器的。

import { event } from 'quasar'

node.addEventListener('click', evt => {
// 左点击?
(Boolean) event.leftClick(evt)

// 中间点击?
(Boolean) event.middleClick(evt)

// 右键点击?
(Boolean) event.rightClick(evt)

// 键入数字格式
(Number) event.getEventKey(evt)

// 鼠标滚轮滚动距离(以像素为单位)
(Number) event.getMouseWheelDistance(evt)

// 在视区上的位置
   //适用于鼠标和触摸事件!
(Object {top, left}) event.position(evt)

// 获取目标DOM元素, 当鼠标或触摸
  // 事件已经发生时
(DOM Element) event.targetElement(evt)

// 调用stopPropagation和preventDefault
event.stopAndPrevent(evt)
})

过滤

基于特定字段筛选出一组对象:

import { filter } from 'quasar'

let data = [{fee: 5, desc: 'Bla bla'}, {fee: 10, desc: 'Bla bla'}, {fee: 1, desc: 'Bla bla'}]
console.log(filter('5', {field: 'fee', list: data}))
// [{fee: 5, desc: 'Bla bla'}]