Access to active components from their parent

Question

I am in a situation where I would like to access instances created from the Ractive component from the parent Ractive. For example.

var myComponent = Ractive.extend(
    {
        uselessFunction: function()
        {
            alert('Hello ' + this.data.who);
        }
    }
);

var myRactive = new Ractive(
    {
        el: 'body',
        components:
        {
            mycomponent: myComponent
        },
        template: '{{#people}}<rv-mycomponent who="{{.}}"/>{{/people}}',
        data:
        {
            people:
            [
                'Mike',
                'Charly',
                'April'
            ]
        }
    }
);

By running this, I get 3 instances of myComponent. Now what I would like would be in some way to call a useless function on any instance of the component from the myRactive method (or even better for all instances).

, (, , - ), - . , myRactive Object, . , , , teardown() myComponent teardown() .

Answer 1

: . - ractive.findComponent(name) ractive.findAllComponents(name)

---

, :

people = [];

Ractive.components.person = Ractive.extend({
  init: function () {
    people.push( this );
  },
  uselessFunction: function () {
    alert( 'Hello ' + this.get('who') );
  }
};

ractive = new Ractive({
  el: 'body',
  template: '{{#people}}<person who="{{.}}"/>{{/people}}',
  data: { people: [ 'Mike', 'Charly', 'April' ] }
};

// later...
people[0].uselessFunction(); // alerts 'Hello Mike'

(nb , , 0.3.8, rv- Ractive.components.)

, . , . , , , ractive.find() ractive.findAll() - ractive.el.querySelector()/ractive.el.querySelectorAll() - (, ractive.findAll('people')), DOM. !

Answer 2

, . findComponent() :

ractiveInstance.findComponent( name )

Answer 3

, :

Ractive.defaults.isolated=true;
componentsHash = {};  // GLOBAL
Ractive.defaults.oninit=function(){
    if (this.get('ref'))
        componentsHash[this.get('ref')]=this;
};
Ractive.defaults.onteardown=function(){
    if (this.get('ref') && componentsHash[this.get('ref')])
        delete(componentsHash[this.get('ref')]);
};

"componentsHash" .

:

<some-component ref="Mike1"/>
<some-component ref="Mike2"/>

Mike1, :

componentsHash['Mike1']