Вопросы Теги

Как я симулирую событие onFocus в react?

Я мигрирую доказательства EcmaScript в Typescript и у меня есть проблемы в особенности с этой линией:

wrapper.instance().focus();

что приходит из этого фрагмента:

const suggestions: Array<React.ReactElement> = [React.createElement('p', null, 'afc163'), React.createElement('p', null, 'benjycui'), React.createElement('p', null, 'yiminghe'), React.createElement('p', null, 'RaoHai'), React.createElement('p', null, '中文'), React.createElement('p', null, 'にほんご')];
    const wrapper = mount(
      <Mention
        defaultValue={toContentState('@afc163')}
        onFocus={handleFocus}
        suggestions={suggestions}
      />,
    );
wrapper.instance().focus();
jest.runAllTimers();
expect(handleFocus).toHaveBeenCalled();

Это - то, что я попробовал:

import * as React from 'react';
.
.
.
const focus = wrapper.find('Mention').prop('onFocus');
if (focus) {
  focus(new React.FocusEvent<HTMLElement>());
}

Но я получаю ошибку

Ошибка: (29, 23) TS2339: Property 'FocusEvent' does not exist on type 'typeof React'.

Я попробовал изменять кроме того код в

wrapper.find('Mention').simulate('onFocus');

но сейчас он дает мне ошибку

Mention ›should существуешь focus function

Method “simulate” is meant to be run on 1 node. 2 found instead.

  at ReactWrapper.single (node_modules/enzyme/src/ReactWrapper.js:1166:13)
  at ReactWrapper.single [as simulate](node_modules/enzyme/src/ReactWrapper.js:665:17)
  at Object.<anonymous> (components/mention/__tests__/index.test.js:26:1)
2
задан 23.07.2019, 00:54
1 ответ

refs предоставляют способ соглашаться на узлы DOM или на элементы React, созданных в mГ©todo renderizado. С jsx ты мог бы делать что-либо подобное: 

class App extends React.Component{
      nameInput = null;
      componentDidMount(){
        this.nameInput && this.nameInput.focus();
      }
      render() {
        return(
          <div>
            <input 
              ref={(input) => { this.nameInput = input; }} 
              defaultValue="will focus"
            />
          </div>
        );
      }
    }

    ReactDOM.render(<App />, document.getElementById('app'));
0
ответ дан 01.12.2019, 23:19