react-render之ifelse

最新推荐文章于 2024-08-03 08:56:57 发布

静艺fly

最新推荐文章于 2024-08-03 08:56:57 发布

阅读量3k

点赞数

分类专栏： React

本文链接：https://blog.csdn.net/tools2016/article/details/79883758

版权

这篇博客探讨了在React中处理条件渲染时遇到的问题。作者在尝试使用if...else语句根据菜单等级显示相关操作时遇到了错误，具体表现为在调用handleUpdate方法时出现找不到方法的错误。尽管该方法已定义，但可能由于if...else结构导致了this的指向问题。为了解决这个问题，作者改用了三元运算符进行条件判断，从而解决了错误。

摘要由CSDN通过智能技术生成

场景：根据菜单等级显示相关操作。

开始采用if…… else……方式，结果报错，代码如下：

render : (text, record) => (
	if (text != "c") {
		<span className="table-action">
			<AmdinChildrenMenuModal record={record} onOk={(record) =>this.handleAddChildrenMenu(record)} >
				<Button size="small">添加</Button>
			</AmdinChildrenMenuModal>
			<AmdinMenuModalEdit record={record} onOk={(record) =>this.handleUpdate(record)} >
				<Button size="small">编辑</Button>
			</AmdinMenuModalEdit>
			<Popconfirm title="确定要删除吗？" onConfirm={() => this.handleDelete(record)}>
				<Button size="small">删除</Button>
			</Popconfirm>
		</span>
	} else {
		<span className="table-action">
			<AmdinMenuModalEdit record={record} onOk={(record) =