lucky-canvas icon indicating copy to clipboard operation
lucky-canvas copied to clipboard

taro3.6.15安装插件在小程序报错。taro编译未发现问题

Open ShiJiuHuaSheng opened this issue 1 year ago • 2 comments

taro

  • 你使用的是哪个包(必填): taro3.6.15

  • 你当前插件的版本(必填): "@lucky-canvas/taro": "^0.0.14",

  • 当前环境是小程序还是浏览器(选填): 小程序

  • 详细描述你的bug: npm install @lucky-canvas/taro@latest安装完,启动编译,微信开发工具上面就报错了 排查问题是先清空插件模板,发现没用,然后卸载插件包,就好了。不报错了,又安装了一次还是报错。就是小程序加载一下直接报错卡在index页面 image

  • 问题代码(重要):

  • 下面是压缩包小demo。npm i npm run dev:weapp 在微信开发工具打开 taro-template-demo.zip

// 代码开始, 别再放歪了行吗
import { View } from "@tarojs/components";
import { useRef, useState } from "react";
import { LuckyWheel } from "@lucky-canvas/taro/react";
import { useLoad } from "@tarojs/taro";
import "./lotteryDraw.scss";

export default function LotteryDraw() {
  const myLucky:any = useRef(null);
  const [blocks, setBlocks] = useState([
    { padding: "13px", background: "#617df2" },
  ]);
  const [prizes, setPrizes] = useState([
    { 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, setButtons] = useState([
    { radius: '50px', background: '#617df2' },
    { radius: '45px', background: '#afc8ff' },
    {
      radius: '40px', background: '#869cfa',
      pointer: true,
      fonts: [{ text: '开始\n抽奖', top: '-20px' }]
    },
  ]);

  useLoad(() => {
    console.log("Page loaded.");
  });

  return (
    <View>
      <LuckyWheel
        ref={myLucky}
        width='300px'
        height='300px'
        blocks={blocks}
        prizes={prizes}
        buttons={buttons}
        onStart={() => {
          // 点击抽奖按钮会触发star回调
          // 调用抽奖组件的play方法开始游戏
          myLucky.current.play();
          // 模拟调用接口异步抽奖
          setTimeout(() => {
            // 假设后端返回的中奖索引是0
            const index = 0;
            // 调用stop停止旋转并传递中奖索引
            myLucky.current.stop(index);
          }, 2500);
        }}
        onEnd={(prize) => {
          // 抽奖结束会触发end回调
          console.log(prize);
        }}
      ></LuckyWheel>
    </View>
  );
}

// 代码结束

ShiJiuHuaSheng avatar Sep 08 '23 12:09 ShiJiuHuaSheng

@buuing 很抱歉这么晚麻烦你,望尽快了解

ShiJiuHuaSheng avatar Sep 08 '23 12:09 ShiJiuHuaSheng

请问这个问题你解决了嘛?

wuhongdan avatar Dec 14 '23 06:12 wuhongdan