Files
gaoYuJournal/miniprogram/components/background/raindrop/index.ts
2025-12-05 18:21:09 +08:00

60 lines
1.1 KiB
TypeScript

// components/background/raindrop/index.ts
import Toolkit from "../../../utils/Toolkit";
interface Raindrop {
x: number;
length: number;
speed: number;
}
Component({
data: {
raindrops: [] as Raindrop[],
timer: undefined as number | undefined,
docWidth: 375,
docHeight: 667,
},
methods: {
createRaindrop() {
const raindrop = {
x: Toolkit.random(0, this.data.docWidth),
length: Toolkit.random(20, 40),
speed: Toolkit.random(1, 2)
};
this.setData({
raindrops: [...this.data.raindrops, raindrop]
});
}
},
lifetimes: {
attached() {
const systemInfo = wx.getWindowInfo();
this.setData({
docWidth: systemInfo.windowWidth,
docHeight: systemInfo.windowHeight,
timer: setInterval(() => {
this.createRaindrop();
if (60 < this.data.raindrops.length) {
if (this.data.timer) {
clearInterval(this.data.timer);
}
this.setData({
timer: undefined
})
}
}, 100)
});
},
detached() {
if (this.data.timer) {
clearInterval(this.data.timer);
this.setData({
timer: undefined
})
}
}
}
})