canvas无法显示

canvas无法显示

使用一个类去绘制canvas，在浏览器元素上能显示canvas已被创建但是就是无法显示

预期效果

以下是原代码

以下为Props参数

//  动态飘带参数
      RibbonAnimation: {
        //   动态飘带各类参数
        RIBBON_OPTIONS: {
          size: 90, // 默认数据
          opacity: 0.6, //  透明度
          zIndex: -11, //  层级
          opt: {
            // 色带HSL饱和度
            colorSaturation: '80%',
            // 色带HSL亮度量
            colorBrightness: '60%',
            // 带状颜色不透明度
            colorAlpha: 0.65,
            // 在HSL颜色空间中循环显示颜色的速度有多快
            colorCycleSpeed: 6,
            // 从哪一侧开始Y轴 (top|min, middle|center, bottom|max, random)
            verticalPosition: 'center',
            // 到达屏幕另一侧的速度有多快
            horizontalSpeed: 200,
            // 在任何给定时间，屏幕上会保留多少条带
            ribbonCount: 5,
            // 添加笔划以及色带填充颜色
            strokeSize: 0,
            // 通过页面滚动上的因子垂直移动色带
            parallaxAmount: -0.5,
            // 随着时间的推移，为每个功能区添加动画效果
            animateSections: true,
          },
          ribbonShow: true, //  点击彩带  true显示  false为不显示
          ribbonAnimationShow: true, // 滑动彩带
        },
        // 飘带是否显示
        RIBBONANIMATION_SHOW: true,
      },

• 你看下这篇博客吧, 应该有用👉 ：canvas的使用方法