lucky-canvas
lucky-canvas copied to clipboard
taro3.6.15安装插件在小程序报错。taro编译未发现问题
taro
-
你使用的是哪个包(必填): taro3.6.15
-
你当前插件的版本(必填): "@lucky-canvas/taro": "^0.0.14",
-
当前环境是小程序还是浏览器(选填): 小程序
-
详细描述你的bug: npm install @lucky-canvas/taro@latest安装完,启动编译,微信开发工具上面就报错了 排查问题是先清空插件模板,发现没用,然后卸载插件包,就好了。不报错了,又安装了一次还是报错。就是小程序加载一下直接报错卡在index页面
-
问题代码(重要):
-
下面是压缩包小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>
);
}
// 代码结束
@buuing 很抱歉这么晚麻烦你,望尽快了解
请问这个问题你解决了嘛?