二级菜单，部分

components/Sakura.js

@@ -1,10 +1,19 @@
 /* eslint-disable */
-import React from 'react'
-
+import { useEffect } from 'react'
+const id = 'canvas_sakura'
 export const Sakura = () => {
-  React.useEffect(() => {
+  const destroySakura = ()=>{
+    const sakura = document.getElementById(id)
+    if(sakura && sakura.parentNode){
+      sakura.parentNode.removeChild(sakura)
+    }
+  }
+      
+  useEffect(() => {
     createSakura({})
+    return () => destroyRibbon()
   }, [])
+  return <></>
 }
 
 /**
@@ -129,7 +138,7 @@ function createSakura() {
       'style',
       'position: fixed;left: 0;top: 0;pointer-events: none;'
     )
-    canvas.setAttribute('id', 'canvas_sakura')
+    canvas.setAttribute('id', id)
     document.getElementsByTagName('body')[0].appendChild(canvas)
     cxt = canvas.getContext('2d')
     var sakuraList = new SakuraList()
@@ -165,15 +174,12 @@ function createSakura() {
       stop = requestAnimationFrame(asd)
     }
   }
-  window.onresize = function () {
-    var canvasSnow = document.getElementById('canvas_snow')
-  }
   img.onload = function () {
     startSakura()
   }
   function stopp() {
     if (staticx) {
-      var child = document.getElementById('canvas_sakura')
+      var child = document.getElementById(id)
       child.parentNode.removeChild(child)
       window.cancelAnimationFrame(stop)
       staticx = false