1***@qq.com
1***@qq.com
  • 发布:2024-04-08 19:05
  • 更新:2024-04-24 10:41
  • 阅读:93

uni-app 微信小程序skyline渲染怎么使用worklet驱动动画?

分类:uni小程序sdk

vue3 composition api uni-app cli项目

报 this.applyAnimatedStyle is not a function

worklet:ongesture="handlepan" 绑定的事件编译成小程序代码后在对应js文件直接找不到

有在uni-app微信小程序里使用worklet手势动画的示例吗?

2024-04-08 19:05 负责人:无 分享
已邀请:
m***@weiwait.cn

m***@weiwait.cn

<script lang="ts">  
import WuiNavigationBar from "@/components/wui-navigation-bar.vue";  
import {defineComponent} from "vue";  

export default defineComponent({  
  methods: {  
    scrollUpdateHandler({detail}: any): void {  
      'worklet'  
      console.log(detail.scrollTop)  
    }  
  },  
  components: {  
    WuiNavigationBar  
  },  
})  
</script>
  • m***@weiwait.cn

    script setup不行,得用options模式

    2024-04-23 17:48

m***@weiwait.cn

m***@weiwait.cn

<script lang="ts">  
import WuiNavigationBar from "@/components/wui-navigation-bar.vue";  
import {defineComponent} from "vue";  

// @ts-ignore  
const {shared: _shared} = wx.worklet  
const _offset = _shared(0)  

export default defineComponent({  
  onLoad(query) {  
    // @ts-ignore  
    const $this = this.$scope  

    console.log('offset', _offset.value)  
    $this.applyAnimatedStyle('.header', () => {  
      'worklet'  
      return {  
        transform: `translateX(${_offset.value}px)`  
      }  
    })  
  },  
  methods: {  
    scrollUpdateHandler({detail}: any): void {  
      'worklet'  
      _offset.value = detail.scrollTop  
    },  
  },  
  components: {  
    WuiNavigationBar  
  },  
})  
</script>

要回复问题请先登录注册