Блог

Главная - Вопросы по программированию - Ссылочная функция Javascript из функции fat arrow, или как запускать функцию каждые X секунд

Ссылочная функция Javascript из функции fat arrow, или как запускать функцию каждые X секунд

#javascript #reactjs #function #object #ecmascript-6

#javascript #reactjs #функция #объект #ecmascript-6

Вопрос:

я в основном занимаюсь Java, и делал это долгое время.

Но сейчас я пытаюсь создать простой интерфейс с react.

Но я не могу понять, как я буду вызывать функцию извне class Home extends Component 

 function queryJobTime () {

    console.log('activated');
    queryJob()
    console.log(active)
}

которая находится за пределами 

 class Home extends Component {

   constructor(props) {
     super(props)
     this.state = {...}
   } 

   queryJob = () => { ..long axios method.. }

   ..many lines omitted...

   setInterval(function () { queryJobTime(); }, 60);

}

Если я удалю все строки, но console.log('activated'); он действительно будет постоянно регистрироваться. Но это бесполезно, мне нужно запросить конечную точку и продолжить, если результаты доступны.

Итак, я хочу вызвать queryJob = () => {} (axios fat arrow что-то внутри класса Home) из функции queryJobTime()

 function queryJobTime()

следует запускать СООБЩЕНИЕ axios каждые X секунд, чтобы определить, завершена ли длительная-длительная-длительная задача сервера.

Комментарии:

1. Находится ли функция в том же файле, но вне компонента, или в другом файле все вместе?

2. Если queryJobTime находится за пределами класса, к которому у него не будет доступа, queryJob потому что это нестатический метод класса. Вам нужно переместить логику queryJobTime в класс, а затем вызвать queryJob как this.queryJob

3. Как бы вы сделали это на Java?

Ответ №1:

Создайте new Home (аргумент props требуется только в том случае, queryJob если требуется props):

 function queryJobTime() {
    console.log("activated");
    new Home("prop").queryJob();
    console.log(active");
}

Комментарии:

1. Щенок, это работает. Еще один вопрос. как мне теперь остановить запрос? у меня был clearInterval (интервал), когда автозапрос if завершается, но теперь интервал не определен.

Ответ №2:

Вы могли бы запустить метод queryJob on componentDidMount и использовать рекурсию с setTimeout , чтобы повторять его вызов до тех пор, пока обещание не будет выполнено.

ДЕМОНСТРАЦИЯ

 let completed = false;
setTimeout(() => completed = true, 3000);

function queryJobTime() {
  console.log('activated')
  return new Promise((resolve, reject) => {
    if (completed) resolve("Completed");
    else reject()
  })
}

class Home extends React.Component {
  state = {
    completed: false
  }

  componentDidMount = () => {
    this.queryJob()
  }

  queryJob = async() => {
    try {
      const res = await queryJobTime()
      this.setState({completed: true})
      console.log(res)
    } catch (err) {
      setTimeout(() => this.queryJob(), 300)
    } 
  }

  render() {
    if (this.state.completed) return <div> Completed </div>
    else return <div> Not Completed </div>
  }
}

ReactDOM.render( 
  <Home /> ,
  document.getElementById('container')
);