EmberJS 4.2 + SocketIO 4 setup

In my application, when I refresh the page, sometime I can't able to get data with SocketIO.

I think the event emitter was triggered before socket connecting to server.

SocketIO Code:

import { io } from 'socket.io-client';

export default class SocketIoService extends Service {

  @action io() {
    return io('http://localhost:3030', {});
  }
}

Data receiving Code:

export default class DataService extends Service {
  @service('socket-io') socket;

  @tracked data;

  @action getData() {
    let socket = this.socket.io();

    socket.on('data-response', (data) => {
      this.data = data
    })

    socket.emit('data-request');
  }
}

I'm new to EmberJS, I didn't find any latest class(oops) based example code.

Also suggest any boilerplate or open source with latest version please.