javascript - 导出后反应功能导出不起作用
问题描述
我有这样的功能:
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 不是函数的错误,我错过了什么?
解决方案
你需要这个改变:
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>
推荐阅读
- angular - Angular 获取 URL 参数并将它们写入输入字段
- internationalization - 如何在 ActiveReports 11 中实现语言/文化(尚不支持)?
- wordpress - wordpress 管理面板 504 网关超时类别
- jenkins - Jenkins Scripted Pipeline - 在节点分配工作空间之前指定工作空间目录
- r - dplyr 中按组/时间指示器的滞后变量
- codeigniter - 表达式引擎 2 中的电子邮件消息中的换行符
- light-4j - 如何在 light-4j 中自定义 JWT 验证
- python - Python - 我可以使用 lambda 函数通过 tkinter 生成重复的 GUI 吗?(标签/文本/按钮)
- linux - root 在用户的 bash_history 中看不到 HISTTIMEFORMAT
- cmake - 代码生成器生成自己的 CMake 文件和目标