Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Taro lucky-canvas 获取不到 canvas 标签 #516

Open
Winner-Wei opened this issue Oct 13, 2024 · 0 comments
Open

Taro lucky-canvas 获取不到 canvas 标签 #516

Winner-Wei opened this issue Oct 13, 2024 · 0 comments

Comments

@Winner-Wei
Copy link

  • 你当前是什么框架(必填):vue3 + Taro H5, 版本3.4.13
  • 你使用的是哪个包(必填):@lucky-canvas/taro": "^0.0.14
  • 你当前插件的版本(必填):@lucky-canvas/taro": "^0.0.14
  • 当前环境是小程序还是浏览器(选填):vue3 + Taro H5, 版本3.4.13
  • 详细描述你的bug:刷新浏览器,有的时候正常,有的时候就报 “lucky-canvas 获取不到 canvas 标签”
  • 问题代码(重要):没有问题代码,按照官方文档那么写就偶发性的报错
// 代码开始, 别再放歪了行吗
<LuckyWheel
  ref="myLucky"
  :prizes="prizes"
  :blocks="blocks"
  :buttons="buttons"
  @start="startCallback"
  @end="endCallback"
></LuckyWheel>

const myLucky = ref<any>(null);

const blocks = ref([{ padding: pxTransform(6), background: '#FFDDA0' }]);

const prizes = ref([
  { fonts: [{ text: '0', top: '10%' }], background: '#e9e8fe' },
  { fonts: [{ text: '1', top: '10%' }], background: '#b8c5f2' },
  { fonts: [{ text: '2', top: '10%' }], background: '#e9e8fe' },
  { fonts: [{ text: '3', top: '10%' }], background: '#b8c5f2' },
  { fonts: [{ text: '4', top: '10%' }], background: '#e9e8fe' },
  { fonts: [{ text: '5', top: '10%' }], background: '#b8c5f2' },
])

const buttons = ref([
  {
    radius:  pxTransform(80), background: 'none',
    fonts: [
      { text: '抽奖', top: pxTransform(-45), fontColor: '#fff', fontStyle: 'JDLangZhengTi', fontWeight: 600, fontSize: pxTransform(54) },
      { text: '还剩10次', top: pxTransform(18), fontColor: '#fff', fontStyle: 'PingFang SC', fontWeight: 400, fontSize: pxTransform(18) },
    ],
    imgs: [
      {
        width: pxTransform(200),
        height: pxTransform(250),
        top: pxTransform(-140),
        src: require('@/assets/image/activity/turntable/pointer.png')
      }
    ]
  }
])

// 点击抽奖按钮会触发star回调
const startCallback = () => {
  myLucky.value.play();
  setTimeout(() => {
    const index = 7;
    myLucky.value.stop(index)
  }, 2000);
}

// 抽奖结束会触发end回调
const endCallback  = (prize: any)  => {
  prizeResultInfo.visible = true;
  prizeResultInfo.type = prize.fonts[0].type;
  prizeResultInfo.name = prize.fonts[0].text;
  prizeResultInfo.img = prize.imgs[0].src;
}
// 代码结束
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant