javascript - Vue和Rainyday.js

我试图找到使用Vue和rainyday.js的方法，但是找不到任何相关的东西。如何使用Vue实现rainyday.js？

<body onload="run();">
    <img id="background" alt="background" src="" />
</body>
<script src="./js/rainyday.min.js"></script>
<script>
    function run() {
        var image = document.getElementById('background');
        image.onload = function () {
            var engine = new RainyDay({
                image: this
            });
            engine.rain([
                [1, 2, 8000]
            ]);
            engine.rain([
                [3, 3, 0.88],
                [5, 5, 0.9],
                [6, 2, 1]
            ], 100);
        };
        image.crossOrigin = 'anonymous';
        image.src = 'http://i.imgur.com/N7ETzFO.jpg';
    }
</script>

我将run函数修改为mounted，但是它不起作用

最佳答案

我尝试下面的方法，它的工作原理。

下载rainyday.js库from this path。通过index.html中的rainyday.js导入<script>

这使得RainyDay class在全局范围内可用。现在您可以在任何vue组件中使用RainyDay class

Vue component (App.vue for example)