FindDOMNode Flux/ Alt Store

Question

Я пытаюсь получить доступ к dom-узлу из магазина (используя alt), чтобы анимировать с помощью speed.js, но получаю только "не могу прочитать свойство undefined". Можно ли использовать findDOMNode из магазина alt/flux?

import React from 'react'
import alt from '../_alt';
import Actions from '../actions/actions';
import Velocity from 'velocity-animate/velocity';
import Body from '../modules/level_1/body/body1'


class Store {

  constructor(){

    this.bindListeners({
      menuToggle: Actions.MENU_TOGGLE
    });

    this.menuStatus = false

  }

  menuToggle(){
    if (!this.menuStatus){ 
      this.menuStatus = true;
      Velocity(React.findDOMNode(Body.refs.wrap),({ width: '50px' }), 50) 
    } else {
      this.menuStatus = false;
    }
  }

}

export default alt.createStore(Store, 'Store');

Составная часть:

import React from 'react';
import connectToStores from 'alt/utils/connectToStores';
import Store from '../../../stores/store'
import Actions from '../../../actions/actions';
import Styles from './body1.css';


import Hero from '../../objects/hero/full_width' 

let image = ['../../../../assets/full_width1.jpg', 'image']

@connectToStores
export default class Body extends React.Component {

  static getStores(){
    return [Store];
  }

  static getPropsFromStores(){
    return Store.getState();
  }

    render(){
        return (
            <div ref='wrap'>
                <Hero content={image} />
            </div>
        );
    }

}

Answer 1

Кузов - класс реакции, у которого нет ссылок. Что вам нужно, это элемент реагирования (экземпляр класса реагирования), который является "этим" внутри рендера, componentDidMount и т. Д.

Вам нужно будет каким-то образом предоставить элемент реакции хранилищу (возможно, вызвав menuToggle с фактическим элементом реакции).

В качестве альтернативы вы можете использовать componentDidMount, чтобы установить ссылку на класс Body, чтобы toggle мог ее использовать.

Answer 2

Шаблон, который я использовал с некоторым успехом, заключается в создании действия инициализации, которое принимает в качестве одного из аргументов компонент React. Затем в componentDidMount() Вы можете назвать это действие, передавая this в качестве аргумента. Это позволяет вашему магазину иметь дескриптор этого элемента React, а также все связанные с ним свойства, чтобы вы могли делать такие вещи, как React.findDOMNode(component.refs['someref']),