Redux: E quanto aos árbitros?

Criado em 27 jun. 2015  ·  8Comentários  ·  Fonte: reduxjs/redux

Se eu usar um <Connector> torno de alguns componentes que têm um atributo ref , não poderei mais acessá-lo por meio de this.refs . Acabei de refatorar um pouco para consertá-lo - estou supondo que isso é em vão entre componentes inteligentes e burros. Ou estou perdendo algo simples?

help wanted question

Comentários muito úteis

Desculpe, mas não vejo como encorajar o uso de 'findDOMNode' em um caso tão trivial pode ser considerado uma solução. Este é um anti-padrão! Isso nos leva de volta aos dias de jquery onde precisamos acessar todos os elementos e saber exatamente a hierarquia dos nós. Seus documentos lidos corretamente:

'findDOMNode () é uma saída de emergência ... o uso desta saída de emergência é desencorajado porque perfura a abstração do componente'

Todos 8 comentários

componentes inteligentes versus burros

Acho que sim, seu componente _smart_ com o Connector deve apenas renderizar os componentes _dumb_ e passar o props para eles.

@cymen você pode usar um retorno de chamada de referência para isso :)

const decorator = (Base) => {
  return class {
    render() {
      return <Base {...this.props} />
    }
  }
}

<strong i="7">@decorator</strong>
class Test {

  render () {
    return <div ref={this.props.refCallback}>my div</div>;
  }

}


class Wrapper {

  componentWillMount() {
    this.nestedRef = null;
  }

  componentDidMount() {
    console.log(React.findDOMNode(this.nestedRef));
  }

  setNestedRef = (ref) => {
    this.nestedRef = ref;
  }

  render() {
    return <Test refCallback={this.setNestedRef} />
  }
}

O acima irá registrar o div. Talvez isso ajude?

Isso usa um decorador, mas provavelmente funcionaria tão bem se você passasse um retorno de chamada para seus componentes aninhados dentro de Connector . Dentro do retorno de chamada, você pode atribuir o ref de volta ao seu componente.

Você realmente precisa de um ref aninhado?

Se você quiser apenas acessar o nó DOM, você pode fazer findDOMNode no componente externo e funcionará perfeitamente. (Eles apontarão para o mesmo nó.)

Se você quiser chamar métodos, considere usar props como a interface declarativa. Veja também https://github.com/jsstyles/react-jss/issues/15 para uma discussão sobre isso.

Finalmente, se você estiver _certificado_, você precisa de um ref, sim, você pode pegar um ref aninhado como @johanneslumpe sugerido em https://github.com/gaearon/redux/issues/183#issuecomment -115988937.

Encerrando, por favor me avise se algo não estiver claro.

Desculpe, mas não vejo como encorajar o uso de 'findDOMNode' em um caso tão trivial pode ser considerado uma solução. Este é um anti-padrão! Isso nos leva de volta aos dias de jquery onde precisamos acessar todos os elementos e saber exatamente a hierarquia dos nós. Seus documentos lidos corretamente:

'findDOMNode () é uma saída de emergência ... o uso desta saída de emergência é desencorajado porque perfura a abstração do componente'

Desculpe, mas não vejo como encorajar o uso de 'findDOMNode' em um caso tão trivial pode ser considerado uma solução. Este é um anti-padrão! Isso nos leva de volta aos dias de jquery onde precisamos acessar todos os elementos e saber exatamente a hierarquia dos nós.

Não tenho certeza do que você quer dizer. Estou dizendo que, se você precisar de uma referência ao nó renderizado (por exemplo, para calcular seu deslocamento e tamanho), pode usar findDOMNode(this) . Não estou sugerindo que você “vá mais fundo” ou mude isso.

Dito isso, se você não estiver satisfeito com isso, apenas use os adereços ref callback como sugerido acima.

Não acho que devemos depender de findDOMNode(this) visto que não se aplica ao React-Native.

@xvalentino findDOMNode não é necessário. Veja os bits relacionados a getWrappedInstance nos documentos da

Esta página foi útil?
0 / 5 - 0 avaliações