# lime-shared 工具庫
- 本人插件的幾個公共函數
- 按需引入


## 引入
按需引入只會引入相關的方法，不要看著 插件函數列表多 而占空間，只要不引用不會被打包
```js
import {getRect} from '@/uni_modules/lime-shared/getRect'
```

## 目錄
+ [getRect](#api_getRect): 獲取節點尺寸信息
+ [addUnit](#api_addUnit): 將未帶單位的數值添加px，如果有單位則返回原值
+ [unitConvert](#api_unitConvert): 將帶有rpx|px的字符轉成number,若本身是number則直接返回
+ [canIUseCanvas2d](#api_canIUseCanvas2d): 環境是否支持使用 canvas 2d
+ [getCurrentPage](#api_getCurrentPage): 獲取當前頁
+ [base64ToPath](#api_base64ToPath): 把base64的圖片轉成臨時路徑
+ [pathToBase64](#api_pathToBase64): 把圖片的臨時路徑轉成base64
+ [sleep](#api_sleep): async 內部程序等待壹定時間後再執行
+ [throttle](#api_throttle): 節流
+ [debounce](#api_debounce): 防抖
+ [random](#api_random): 返回指定範圍的隨機數
+ [range](#api_range): 生成區間數組 
+ [clamp](#api_clamp): 夾在min和max之間的數值 
+ [floatAdd](#api_floatAdd): 返回兩個浮點數相加的結果
+ [fillZero](#api_fillZero): 補零，如果傳入的是個位數則在前面補0
+ [exif](#api_exif): 獲取圖片exif
+ [selectComponent](#api_selectComponent): 獲取頁面或當前實例的指定組件
+ [createAnimation](#api_createAnimation): uni.createAnimation
+ [animation](#api_animation): 數值從壹個值到另壹個值的過渡
+ [camelCase](#api_camelCase): 字符串轉換為 camelCase 或 PascalCase 風格的命名約定
+ [kebabCase](#api_kebabCase): 將字符串轉換為指定連接符的命名約定
+ [closest](#api_closest): 在給定數組中找到最接近目標數字的元素
+ [isBase64](#api_isBase64): 判斷字符串是否為base64
+ [isNumber](#api_isNumber): 檢查壹個值是否為數字類型
+ [isNumeric](#api_isNumeric): 檢查壹個值是否為數字類型或表示數字的字符串
+ [isString](#api_isString): 檢查壹個值是否為字符串類型
+ [composition-api](#api_composition-api): 為兼容vue2

## Utils


### getRect <a id="api_getRect"></a>
- 返回節點尺寸信息

```js
// 組件內需要傳入上下文
// 如果是nvue 則需要在節點上加與id或class同名的ref
getRect('#id',{context: this}).then(res => {})
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 




### addUnit <a id="api_addUnit"></a> 
- 將未帶單位的數值添加px，如果有單位則返回原值

```js
addUnit(10)
// 10px
```

##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 




### unitConvert <a id="api_unitConvert"></a>
- 將帶有rpx|px的字符轉成number,若本身是number則直接返回

```js
unitConvert('10rpx') 
// 5 設備不同 返回的值也不同
unitConvert('10px') 
// 10
unitConvert(10) 
// 10
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 



### canIUseCanvas2d <a id="api_canIUseCanvas2d"></a>
- 環境是否支持使用 canvas 2d

```js
canIUseCanvas2d()
// 若支持返回 true 否則 false
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 



### getCurrentPage <a id="api_getCurrentPage"></a>
- 獲取當前頁

```js
const page = getCurrentPage()
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 



### base64ToPath <a id="api_base64ToPath"></a>
- 把base64的圖片轉成臨時路徑

```js
base64ToPath(`xxxxx`).then(res => {})
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 



### pathToBase64 <a id="api_pathToBase64"></a>
- 把圖片的臨時路徑轉成base64

```js
pathToBase64(`xxxxx/xxx.png`).then(res => {})
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 



### sleep <a id="api_sleep"></a>
- 睡眠，讓 async 內部程序等待壹定時間後再執行

```js
async next () => {
	await sleep(300)
	console.log('limeui');
}
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 


### throttle <a id="api_throttle"></a> 
- 節流

```js
throttle((nama) => {console.log(nama)}, 200)('limeui');
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 


### debounce <a id="api_debounce"></a>
- 防抖

```js
debounce((nama) => {console.log(nama)}, 200)('limeui');
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 


### random <a id="api_random"></a>
- 返回指定範圍的隨機數

```js
random(1, 5);
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 


### range <a id="api_range"></a>
- 生成區間數組

```js
range(0, 5)
// [0,1,2,3,4,5]
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 



### clamp <a id="api_clamp"></a>
- 夾在min和max之間的數值，如小於min，返回min, 如大於max，返回max，否側原值返回

```js
clamp(0, 10, -1)
// 0
clamp(0, 10, 11)
// 10
clamp(0, 10, 9)
// 9
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 



### floatAdd <a id="api_floatAdd"></a>
- 返回兩個浮點數相加的結果

```js
floatAdd(0.1, 0.2) // 0.3
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 


### fillZero <a id="api_fillZero"></a>
- 補零，如果傳入的是`個位數`則在前面補0

```js
fillZero(9);
// 09
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 


### exif <a id="api_exif"></a>
- 獲取圖片exif
- 支持臨時路徑、base64

```js
uni.chooseImage({
	count: 1, //最多可以選擇的圖片張數
	sizeType: "original",
	success: (res) => {
		exif.getData(res.tempFiles[0], function() {
			let tagj = exif.getTag(this, "GPSLongitude");
			let	Orientation = exif.getTag(this, 'Orientation');  
			console.log(tagj, Orientation)
		})
	}
})
```

##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | x                 | 


### selectComponent <a id="api_selectComponent"></a>
- 獲取頁面或當前實例的指定組件，會在頁面或實例向所有的節點查找（包括子組件或子子組件）
- 僅vue3，vue2沒有測試過

```js
// 當前頁面
const page = getCurrentPage()
selectComponent('.custom', {context: page}).then(res => {
})
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | x                 | 



### createAnimation <a id="api_createAnimation"></a>
- 創建動畫，與uni.createAnimation使用方法壹致，只為了抹平nvue

```html
<view ref="ball" :animation="animationData"></view>
```
```js
const ball = ref(null)
const animation = createAnimation({
  transformOrigin: "50% 50%",
  duration: 1000,
  timingFunction: "ease",
  delay: 0
})

animation.scale(2,2).rotate(45).step()
// nvue 無導出數據，這樣寫只為了平臺壹致，
// nvue 需要把 ref 傳入，其它平臺不需要
const animationData = animation.export(ball.value)
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 



##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 



### camelCase <a id="api_camelCase"></a>
- 將字符串轉換為 camelCase 或 PascalCase 風格的命名約定

```js
camelCase("hello world") // helloWorld
camelCase("hello world", true) // HelloWorld
```

##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 


### kebabCase <a id="api_kebabCase"></a>
- 將字符串轉換為指定連接符的命名約定

```js
kebabCase("helloWorld") // hello-world
kebabCase("hello world_example") // hello-world-example
kebabCase("helloWorld", "_") // hello_world
```

##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 




### closest <a id="api_closest"></a>
- 在給定數組中找到最接近目標數字的元素

```js
closest([1, 3, 5, 7, 9], 6) // 5
```

##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 



### isBase64 <a id="api_isBase64"></a>
- 判斷字符串是否為base64

```js
isBase64('xxxxx')
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 


### isNumber <a id="api_isNumber"></a>
-  檢查壹個值是否為數字類型

```js
isNumber('0') // false
isNumber(0) // true
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 


### isNumeric <a id="api_isNumeric"></a>
-  檢查壹個值是否為數字類型或表示數字的字符串

```js
isNumeric('0') // true
isNumeric(0) // true
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 

### isString <a id="api_isString"></a>
-  檢查壹個值是否為數字類型或表示數字的字符串

```js
isString('0') // true
isString(0) // false
```
##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | √                 | 




## composition-api <a id="api_composition-api"></a>
- 因本人插件需要兼容vue2/vue3，故增加壹個vue文件,代替條件編譯
- vue2需要在main.js加上這壹段
```js
// vue2
import Vue from 'vue'
import VueCompositionAPI from '@vue/composition-api'
Vue.use(VueCompositionAPI)
```

```js
//使用
import {computed, onMounted, watch, reactive} from '@/uni_modules/lime-shared/vue'
```

##### 兼容性
| uni-app      | uni-app x                      | 
|------------|----------------------------------|
| √     | x                 | 
