Сравнение ссылок React для установки имени класса

Question

Сравнение ссылок React для установки имени класса

function* chunkArray(array,size=1){
    var clone = array.slice(0);
    while (clone.length>0) 
      yield clone.splice(0,size); 
};
var a = new Array(100).fill().map((x,index)=>index);
for(const c of chunkArray(a,10)) 
    console.log(c);

0

javascript reactjs ref

задан Jan 22 February 2019 в 12:44

2 ответа

Другие вопросы по тегам:

javascript reactjs ref

Похожие вопросы:

score 0 · Answer 1

Я получил это работает. Я преобразовал компонент функции в компонент класса, и теперь он работает так:

import React, {Component} from 'react';

class EditSocialmedia extends Component {

  constructor(props) {
    super(props);
    this.state = {
      facebook: "",
      youtube: "",
      twitter: "",
      focusedElement: React.createRef()
    };
  }

  render () {
    const {facebook, youtube, twitter} = this.props.social
    return (
      <div>
        <h2 className="hSmaller hthin">Social Media</h2>

        <input id={`facebook`}
               className={this.refFacebook === this.state.focusedElement ? "active" : ""}
               ref={(input) => this.refFacebook = input}
               value={facebook ? facebook : ""}
               onChange={() => {this.setState({facebook: this.refFacebook})}}
               onFocus={() => this.setState({focusedElement: this.refFacebook})}/>

        <input id={`youtube`}
               className={this.refYoutube === this.state.focusedElement ? "active" : ""}
               ref={(input) => this.refYoutube = input}
               value={youtube ? youtube : ""}
               onChange={() => {this.setState({youtube: this.refYoutube})}}
               onFocus={() => this.setState({focusedElement: this.refYoutube})}/>

        <input id={`twitter`}
               className={this.refTwitter === this.state.focusedElement ? "active" : ""}
               ref={(input) => this.refTwitter = input}
               value={twitter ? twitter : ""}
               onChange={() => {this.setState({twitter: this.refTwitter})}}
               onFocus={() => this.setState({focusedElement: this.refTwitter})}/>

      </div>
    )
  }

}

export default EditSocialmedia;

score 0 · Answer 2

onFocus изменяет состояние и заставляет ваш компонент перерисовываться и изменять ссылки. className проверяет неправильные ссылки во время рендера. И test проверяет правильные ссылки после рендеринга.

Попробуйте позвонить test до return, внутри настройки ref и внутри события onFocus.