首页 > 解决方案 > 导出后反应功能导出不起作用

问题描述

我有这样的功能:

let ChoosePage = (i) => {
let urls = [
    'http://localhost:3005/products/774944', 
    'http://localhost:3005/products/774945', 
    'http://localhost:3005/products/774946',
    'http://localhost:3005/products/123581', 
    'http://localhost:3005/products/782691', 
    'http://localhost:3005/products/782485',
    'http://localhost:3005/products/782486', 
    'http://localhost:3005/products/782487', 
    'http://localhost:3005/products/782488',
    'http://localhost:3005/products/738471'];
let urls_sliced = urls;
if (i === 0) {
     urls_sliced = urls.slice(0, 3);
 } else if (i === 1) {
     urls_sliced = urls.slice(4, 7);
 } else if (i === 2) {
     urls_sliced = urls.slice(8, 9);
 }
 let show_items = () => {
    ReactDOM.render(urls_sliced.map((url)=>{
            return(
              <Item url={url}/>
            )
            }), document.getElementById('items'));
        }

        show_items()

}
export default ChoosePage;

我试图通过在另一个 file.js 中使用 onClick 事件来调用它,如下所示:

import ChoosePage from './index';

<Page onClick={ChoosePage(0)}>1</Page>
<Page onClick={ChoosePage(1)}>2</Page>
<Page onClick={ChoosePage(2)}>3</Page>

它返回 Object 不是函数的错误,我错过了什么?

标签: javascriptreactjs

解决方案


你需要这个改变:

import ChoosePage from './index';

<Page onClick={e=>{ChoosePage(0)}}>1</Page>
<Page onClick={e=>{ChoosePage(1)}}>2</Page>
<Page onClick={e=>{ChoosePage(2)}}>3</Page>

推荐阅读