Can not generate a view for the index route


#1

I generated a view for the index route and want to hook the didInsertElemen event.

ember generate view index

then a error occurred.

index
  route.js
  template.hbs
  view.js

view.js

import Ember from 'ember';

export default Ember.View.extend({
});

What’s wrong? Thank you in advance!


#2

Views have been deprecated and were removed in Ember 2.0. See: http://emberjs.com/blog/2015/08/13/ember-2-0-released.html

Views have been removed in Ember 2.0. Components, which provide better isolation and scoping semantics, fulfill the use-cases views were introduced for.

We recognize that existing apps will not complete their migration away from views for several months, so we have published the ember-legacy-views compatibility addon, that will allow you to spread out the transition over more releases. We are committed to maintain support for this addon until at least Ember 2.6.

If you are building a new application, the use-case for views have completely been subsumed by Components. Existing apps should refactor away from the {{view}} helper and Ember.Views in favor of Components.

However, existing applications that make use of top-level Views do not need to immediately refactor those views to components. The future Routable Components will provide a softer transition path for this use-case and we commit to support the compatibility addon until the community has had a chance to transition to Routable Components.


#3

Worth mentioning, if you’re porting an app and still need to retain your views until you get a chance to refactor them out, you can use ember install ember-legacy-views which will bring back Ember.View for 2.0.


#4

I submitted a PR to remove the blueprint for ember-cli 2.x https://github.com/ember-cli/ember-cli/pull/5607


#5

Thank you very much, tomchen, for your quick answer. I started my app from Ember 2.3.0, so I have not to use Views if they are removed.

I have a route ‘index’ and two components which are used in the template of the route. I just want to catch the moment after the two components have been loaded, then I think I can change the size of a canvas in one of the two components. I tried to use the ‘didinsertElement’ of View class.

Do you have some recommendations to do that?

Thanks in advance!


#6

Thank you very much, jasonmit, for your quick answer. I started my app from Ember 2.3.0, so I have not to use Views if they are removed. I’ll try to use other approach to solve my problem.


#7

I think it’s the best way. Thank you.


#8

@litao84 You might want to take a look at the afterModel hook to see if that fits your needs, but I think one of the component lifecycle hooks might be more what you’re after. For example, the didInsertElement hook can be used in the component to handle the behavior that you describe.


#9

tomchen, thank you! the didInsertElement hook works in my case.