狡猾的 JS 错误说我没有关闭函数答案

【问题标题】：Crafty JS error says I'm not closing function狡猾的 JS 错误说我没有关闭函数
【发布时间】：2015-06-10 11:13:36
【问题描述】：

if (char == 'anime') {
        Crafty.sprite("sprites_hunt_w.png", {
                guy: [1, 2, 27, 31]
            })
            .reel('guy_right', 1000, [
                [1, 64],
                [34, 64],
                [65, 65]
            ])
            .reel('guy_left', 1000, [
                [1, 32],
                [34, 32],
                [65, 33]
            ])
    } else {
        Crafty.sprite("megamanx.gif", {
                guy: [0, 0, 28, 34]
            })
            .reel('guy_right', 1000, [
                [214, 19],
                [248, 19],
                [281, 19],
                [321, 19],
                [352, 19],
                [371, 19],
                [394, 19],
                [427, 19]
            ])
            // }else{
            //console.log("fail")
    }

firefox 的控制台显示 TypeError: Crafty.sprite(...).reel is not a function。这是指行

Crafty.sprite("megamanx.gif", {

我不明白的是，对我来说，它看起来与这条线完全相同（除了图像源）

Crafty.sprite("sprites_huntw.png", {

因此，我不明白为什么会出现错误。提前感谢您的帮助

【问题讨论】：

console.log(Crafty.sprite)

标签： javascript craftyjs

【解决方案1】：

您正尝试调用.reel() 作为Crafty.sprite 返回值的方法。但是 Crafty.sprite 不返回精灵实体——它创建一个组件，然后返回全局 Crafty 对象（这样您就可以在 Crafty 上链接方法调用）。

因此，您需要将该组件添加到实体中才能使用它，然后添加 SpriteAnimation 组件来定义卷轴。以下是来自the docs 的示例：

// Define a sprite-map component
Crafty.sprite(16, "images/sprite.png", {
    PlayerSprite: [0,0]
});

// Define an animation on the second row of the sprite map (fromY = 1)
// from the left most sprite (fromX = 0) to the fourth sprite
// on that row (frameCount = 4), with a duration of 1 second
Crafty.e("2D, DOM, SpriteAnimation, PlayerSprite").reel('PlayerRunning', 1000, 0, 1, 4);

// This is the same animation definition, but using the alternative method
Crafty.e("2D, DOM, SpriteAnimation, PlayerSprite").reel('PlayerRunning', 1000, [[0, 1], [1, 1], [2, 1], [3, 1]]);

【讨论】：