1.0.5 • Published 11 months ago
yhuni-utils v1.0.5
yhuni-utils
使用
安装
npm install yhuni-utils
引入
import {yhtouchmove} from 'yhuni-utils'
为组件添加动态样式并指定touchmove方法
<view :style="styles" @touchmove="yhtouchmove($event, styles)"><view>
注意:样例中的styles是用reactive方法创建,如使用ref方法,请传参时传入styles.value
样例
<template>
<view>
<view class="box" :style="styles" @touchmove="yhtouchmove($event,styles)"></view>
</view>
</template>
<script setup>
import {
reactive
} from "vue";
import {yhtouchmove} from 'yhuni-utils'
const styles = reactive({})
</script>
<style>
.box{
background-color: aquamarine;
width: 100vw;
height: 100vw;
}
</style>
如果在同一组件中有多个子组件需要使用旋转功能,请参照如下样例
<template>
<view>
<view class="box" :style="style1" @touchmove="yhtouchmove1($event,style1)"></view>
<view class="box" :style="style2" @touchmove="yhtouchmove2($event,style2)"></view>
</view>
</template>
<script setup>
import {
reactive
} from "vue";
import {useyhtouchmove} from 'yhuni-utils'
const yhtouchmove1 = useyhtouchmove()
const yhtouchmove2 = useyhtouchmove()
const style1 = reactive({})
const style2 = reactive({})
</script>
<style>
.box{
background-color: aquamarine;
width: 50vw;
height: 50vw;
}
</style>