if 语句与我的预期完全相反答案

【问题标题】：if statement doing exact opposite of what I am expectingif 语句与我的预期完全相反
【发布时间】：2017-03-25 01:11:57
【问题描述】：

我确信这很容易，但由于某种原因，我无法弄清楚为什么我会得到相反的结果。如果我使用下面的代码，它将返回第二个 if 结果。如果我将其更改为 != null 它会返回第一个 if 结果。

import React from "react";

export default class ListButtons extends React.Component{

    render(){
        console.log(this.props.before); // null
        if(this.props.before == null){
            return (
                <div>
                    <ul className="pagination">
                        <li>
                            <a href="#">Next</a>
                        </li>
                    </ul>
                </div>
            )
        }else{
            return (
                <div>
                    <ul className="pagination">
                        <li>
                            <a href="#">Previous</a>
                        </li>
                        <li>
                            <a href="#">Next</a>
                        </li>
                    </ul>
                </div>
            )
        }

    }
}

【问题讨论】：

如果它与您的预期相反，this.props.before 可能不是您认为的null？
确保不是字符串"null"
没错。您似乎误解了 if 的工作原理。我觉得你应该好好想想
更改您的console.log()：console.log(this.props.before + " type: " + (typeof this.props.before));
很难判断这段代码应该做什么，因为没有足够的代码来确定this.props.before 的值。如果您寻求调试帮助并且您不告诉人们如何重现问题，那么您将获得很多反对票。您需要提供minimal reproducible example

标签： javascript reactjs

【解决方案1】：

试试这个：

import React from "react";

export default class ListButtons extends React.Component{
    render(){
            const content = !!this.props.before ? (
                <li>
                        <a href="#">Previous</a>
                </li>
                <li>
                        <a href="#">Next</a>
                </li>
            ) : (
                <li>
                        <a href="#">Next</a>
                </li>
            )

            return (
                    <div>
                            <ul className="pagination">
                                    {content}
                            </ul>
                    </div>
            )
    }
}

如果这不起作用，则可能是this.props.before 的设置位置/方式出错。

【讨论】：