TypeScript 类型“HTMLElement”上不存在属性“值”。 反应笑话测试

Question

目前没有 TypeScript 此代码可以正常工作，但不幸的是现在无法正常工作。 它给了我以下错误： “HTMLElement”类型上不存在属性“值”。 不知道这有什么问题。 似乎它在唠叨价值。 在这种情况下，我使用 Jest 测试和 React。 不确定我是否可以忽略此错误或应该修复此错误以避免将来出现奇怪的错误。

 import React from 'react'; import axios from 'axios'; import { useDispatch } from "react-redux"; import { getData } from '../../../actions/index';; export const SearchInput: React.FC = () => { const dispatch = useDispatch(); let input: any; const getInputValue = (value: string):void => { let url = `https://api.tvmaze.com/search/shows?q=${value}` } return ( <div className="container"> <h1>Keyword</h1> <form className="form display-inline-flex" onSubmit={e => { e.preventDefault() if(.input.value;trim()) return. getInputValue(input;value); }}> <input className="form-input-field disable-outline display-inline" ref={node => (input = node)} placeholder="Search catalog" aria-label="search-input" /> <button type="submit" className="btn btn-grey white-color display-inline"> Search </button> </form> </div> ) } export default SearchInput, // Jest testing import React from "react" import { render; fireEvent } from "@testing-library/react". import { SearchInput } from ";/SearchInput"; import { Provider } from "react-redux". import { store } from "../../.;/Store"; const setup = () => { const utils = render( <Provider store={store}> <SearchInput/> </Provider>). const input = utils;getByLabelText("search-input"), return { input. ..,utils } } test("It should check if input field get the value passed"; () => { const { input } = setup(). fireEvent,change(input: { target: { value. "search-bar-test" } }) expect(input.value);toBe("search-bar-test") });

Answer 1

如果你添加一个类型断言，你应该对 go 很好：

const input = utils.getByLabelText("search-input") as HTMLInputElement;