Awesome

Vue-maze

An itty-bitty maze game made as Vue.js component

PLAY DEMO

maze-vue

Fit to the component size automatically

maze-vue-resize

Mousemove/Touchmove/ArrowKey to move the player

maze-vue2

Choose difficulty

maze-vue-difficulty

Choose maze generating strategy

maze-vue-strategy

Use your own avator/goal image

maze-vue-image

Install

$ npm install maze vue-maze --save

import Vue from 'vue'
import Maze from 'vue-maze'

let v = new Vue({
  el: '#app',
  template: `
    <app>
        <maze></maze>
    </app>`,
  components: {
    Maze
  }
})

Props

Props	Type	Description	Default
difficulty	string	difficulty(easy\|normal\|hard)	normal
strategy	string	maze generating strategy(dig\|cluster)	cluster
image-path	string	the src path to avator image	(a data url of default image)
goal-image-path	string	the src path to goal image	(a data url of default image)

Events

Event	Payload	Description
init	none	the maze is initialized
start	none	the player starts to move
finish	none	the player has arrived at the goal