# Update Function Keyboard Problem

**URL:** <https://phaser.discourse.group/t/update-function-keyboard-problem/9965>\
**Category:** Phaser 3\
**Created:** [July 17, 2021, 2:29am UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965 "2021-07-17T02:29:18Z")\
**Posts on this page:** 17\
**Page:** 1

<div class="post-metadata">

**Author:** ![Aragami](https://avatars.discourse-cdn.com/v4/letter/a/51bf81/32.png) [@Aragami](https://phaser.discourse.group/u/Aragami)\
**Post date:** [July 17, 2021, 2:29am UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/1 "2021-07-17T02:29:18Z")

</div>

Hello dear,

I am using Phaser3 with ReactJS

```javascript
export default class playScene extends Phaser.Scene {
....
preload() {...}

create() {
...
this.mySprite = this.physics.add.sprite(400, 390, 'idle1');
this.mySprite.anims.play('idle', true);
this.mySprite.setBounce(0.3);
this.mySprite.setCollideWorldBounds(true);
this.mySprite.setScale(0.2).refreshBody();
this.mySprite.setGravityY(600);
...
}
...
update(){
...
if (this.cursors.left.isDown) {
console.log("Keyboard is ok");
this.mySprite.anims.play('run', true);
this.mySprite.setFlipX(true);
this.mySprite.setVelocityX(-320);
}
...
}

}

```

Everything works fine but my sprite is not move.  
Thanks for youre answers.

---

<div class="post-metadata">

**Author:** ![BlunT76](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/blunt76/32/1454_2.png) [@BlunT76](https://phaser.discourse.group/u/BlunT76)\
**Post date:** [July 17, 2021, 5:45am UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/2 "2021-07-17T05:45:55Z")

</div>

Hi,  
You must create this.cursors in create with:  
this.cursors = this.input.keyboard.createCursorKeys();

---

<div class="post-metadata">

**Author:** ![Aragami](https://avatars.discourse-cdn.com/v4/letter/a/51bf81/32.png) [@Aragami](https://phaser.discourse.group/u/Aragami)\
**Post date:** [July 17, 2021, 8:39am UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/3 "2021-07-17T08:39:36Z")

</div>

Yes, of course, it is ok and keyboard is working.  
But sprite is not moving.  
console.log is working too

---

<div class="post-metadata">

**Author:** ![BlunT76](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/blunt76/32/1454_2.png) [@BlunT76](https://phaser.discourse.group/u/BlunT76)\
**Post date:** [July 17, 2021, 10:19am UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/4 "2021-07-17T10:19:33Z")

</div>

> [@Aragami](#):
>
> `this.mySprite.setVelocityX(-320);`

Try this line instead :  
this.mySprite.body.setVelocityX(-320);

---

<div class="post-metadata">

**Author:** ![Aragami](https://avatars.discourse-cdn.com/v4/letter/a/51bf81/32.png) [@Aragami](https://phaser.discourse.group/u/Aragami)\
**Post date:** [July 17, 2021, 11:19am UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/5 "2021-07-17T11:19:40Z")

</div>

I tried

```javascript
if (this.cursors.left.isDown) {
this.mySprite.body.anims.play('run', true);
this.mySprite.body.setFlipX(true);
this.mySprite.body.setVelocityX(-320);
}

```

But it gives error  
TypeError: Cannot read property ‘play’ of undefined  
I dont understand why

---

<div class="post-metadata">

**Author:** ![BlunT76](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/blunt76/32/1454_2.png) [@BlunT76](https://phaser.discourse.group/u/BlunT76)\
**Post date:** [July 17, 2021, 11:40am UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/6 "2021-07-17T11:40:42Z")

</div>

You must understand the difference between a sprite and a body.  
anims and flip works on the sprite itself  
velocity works on the sprite.body

---

<div class="post-metadata">

**Author:** ![Aragami](https://avatars.discourse-cdn.com/v4/letter/a/51bf81/32.png) [@Aragami](https://phaser.discourse.group/u/Aragami)\
**Post date:** [July 17, 2021, 11:45am UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/7 "2021-07-17T11:45:08Z")

</div>

Thanks mate,

I tried like this

```javascript
    if (this.cursors.left.isDown) {
      this.mySprite.anims.play('run', true);
      this.mySprite.setFlipX(true);
      this.mySprite.body.setVelocityX(-320);
    }

```

But it doesnt work again.  
When i push cursor-key it work.  
I think update() function doesnt see my sprite created in create() function.  
Is there any way to show?  
bind or another kind?

---

<div class="post-metadata">

**Author:** ![BlunT76](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/blunt76/32/1454_2.png) [@BlunT76](https://phaser.discourse.group/u/BlunT76)\
**Post date:** [July 17, 2021, 11:47am UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/8 "2021-07-17T11:47:50Z")

</div>

You can easily check that:  
if (this.cursors.left.isDown) {  
console.log(this.mySprite);  
this.mySprite.anims.play(‘run’, true);  
this.mySprite.setFlipX(true);  
this.mySprite.body.setVelocityX(-320);  
}

check if mySprite has a body property

---

<div class="post-metadata">

**Author:** ![Aragami](https://avatars.discourse-cdn.com/v4/letter/a/51bf81/32.png) [@Aragami](https://phaser.discourse.group/u/Aragami)\
**Post date:** [July 17, 2021, 11:54am UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/9 "2021-07-17T11:54:31Z")

</div>

Yes it has “Body”

`ArcadeSprite {_events: Events, _eventsCount: 2, scene: playScene, displayList: DisplayList, type: "Sprite", …}`  
…  
`body: Body {world: World, gameObject: ArcadeSprite, transform: {…`

---

<div class="post-metadata">

**Author:** ![BlunT76](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/blunt76/32/1454_2.png) [@BlunT76](https://phaser.discourse.group/u/BlunT76)\
**Post date:** [July 17, 2021, 11:56am UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/10 "2021-07-17T11:56:26Z")

</div>

Hmm show me the whole code if you can

---

<div class="post-metadata">

**Author:** ![Aragami](https://avatars.discourse-cdn.com/v4/letter/a/51bf81/32.png) [@Aragami](https://phaser.discourse.group/u/Aragami)\
**Post date:** [July 17, 2021, 12:04pm UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/11 "2021-07-17T12:04:23Z")

</div>

[https://jsfiddle.net/rwc6zvh4/](https://jsfiddle.net/rwc6zvh4/)

---

<div class="post-metadata">

**Author:** ![BlunT76](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/blunt76/32/1454_2.png) [@BlunT76](https://phaser.discourse.group/u/BlunT76)\
**Post date:** [July 17, 2021, 12:30pm UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/12 "2021-07-17T12:30:06Z")

</div>

I don’t understand, i can move a little sprite at the bottom of the screen, with a size similar to the balls moving everywhere.  
Without the assets, i’m not sure if it works as expected.

edit: check here  
https://codepen.io/BlunT76/embed/preview/bGWWjGq?default-tabs=js%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=bGWWjGq

---

<div class="post-metadata">

**Author:** ![Aragami](https://avatars.discourse-cdn.com/v4/letter/a/51bf81/32.png) [@Aragami](https://phaser.discourse.group/u/Aragami)\
**Post date:** [July 17, 2021, 1:20pm UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/13 "2021-07-17T13:20:48Z")

</div>

Doesnt work, i’ll be mad 🙂

---

<div class="post-metadata">

**Author:** ![BlunT76](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/blunt76/32/1454_2.png) [@BlunT76](https://phaser.discourse.group/u/BlunT76)\
**Post date:** [July 17, 2021, 1:26pm UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/14 "2021-07-17T13:26:08Z")

</div>

The codepen doesn’t work ??

---

<div class="post-metadata">

**Author:** ![Aragami](https://avatars.discourse-cdn.com/v4/letter/a/51bf81/32.png) [@Aragami](https://phaser.discourse.group/u/Aragami)\
**Post date:** [July 17, 2021, 1:36pm UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/15 "2021-07-17T13:36:17Z")

</div>

Codepen works.  
My local code is not working.

---

<div class="post-metadata">

**Author:** ![BlunT76](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/blunt76/32/1454_2.png) [@BlunT76](https://phaser.discourse.group/u/BlunT76)\
**Post date:** [July 17, 2021, 1:39pm UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/16 "2021-07-17T13:39:25Z")

</div>

Try with another browser, or without browser’s plugins. Try without the react part…  
The problem isn’t on phaser side…

---

<div class="post-metadata">

**Author:** ![Aragami](https://avatars.discourse-cdn.com/v4/letter/a/51bf81/32.png) [@Aragami](https://phaser.discourse.group/u/Aragami)\
**Post date:** [July 17, 2021, 1:55pm UTC](https://phaser.discourse.group/t/update-function-keyboard-problem/9965/17 "2021-07-17T13:55:06Z")

</div>

You are correct. Phaser side is ok.

I changed the component layout. It is working.  
Super.  
Thank you mate.