Question

单击似乎不会触发console.log（）。

import React from 'react';

import './SearchResult.scss';

const searchResult = props => {
    const listItemClicked = () => {
        console.log('hi');
    };

    return (
        <li key={props.resultName} className="result-list" onClick={() => listItemClicked()}>
            <div className="result">
                <p>{props.resultName[0].toUpperCase() + props.resultName.slice(1)}</p>
            </div>
        </li>
    );
};

export default searchResult;

也许是漫长的一天，但是我无法通过onClick触发console.log ...

谢谢。

Answer 1

在上述代码中添加默认道具。

代码如下：

import React from 'react';
import './SearchResult.scss';

const SearchResult = props => {
    const listItemClicked = () => {
         console.log('hi');
    };

    return (
         <li key={props.resultName} className="result-list" onClick={() =>listItemClicked()}>
            <div className="result">
               <p>{props.resultName[0].toUpperCase() + props.resultName.slice(1)}</p>
            </div>
        </li>
    );
};

SearchResult.defaultProps = {
  resultName:["abc","xyz"]
}

export default SearchResult;

在React中没有触发onClick

1 个答案: