如何检查对象是否包含字符串值？

Question

我知道可以随着h标签的填充而读取对象内部的值，但是即使我的console.log显示确实存在，我也无法敲击检查response.image的值。

我不确定下面是否是检查值的正确语义。我想我可能需要在return语句之前执行此操作。击中response.result.image很好，但是我想是因为我没有像上面的其他2条语句那样检查字符串值。

import React from 'react';
import getResponse from '../Handler/getResponse.jsx';
import Spinner from '../Spinner/Spinner.jsx';

import './Modal.css';

 const Modal = ({close, item}) => {
    const response = getResponse(item);
    console.log(response);

    return (
        <div>
           {response === null &&(<Spinner/>)}
            {response &&(
                <div className='modal'>
                <div className='popup'>
                    <h1>{response.result.name}</h1>
                    <h5>{response.result.description}</h5>
                    {(response.image === "Error") &&(
                        <p className="text">{response.result.detailedDescription.articleBody}</p>
                    )}
                   {response.image && (response.image !== "Error") &&(
                     <div className="container">
                                <div className="left">{response.result.detailedDescription.articleBody}</div>
                        <div className="right"><img className="image" alt="image" src={response.image}/></div>
                     </div>
                   )}
                   {response.result.image &&(
                     <div className="container">
                        <div className="left">{response.result.detailedDescription.articleBody}</div>
                        <div className="right"><img className="image" alt="image" src={response.result.image.contentUrl}/></div>
                     </div>
                   )}
                   <button onClick={ () => { close(false) }}>close me</button>
                </div>
              </div>
            )}
        </div>
   );
}

export default Modal;

Answer 1

您可以尝试一下吗，我认为您忘记了响应中的数据键，但是由于我没有getResponse（）函数，因此无法确定吗？

import React from 'react';
import getResponse from '../Handler/getResponse.jsx';
import Spinner from '../Spinner/Spinner.jsx';

import './Modal.css';

 const Modal = ({close, item}) => {
    const r = getResponse(item);
    const response = r.data;

    console.log(response);


    // You can check if it is string with this one;
   if (typeof response.image === 'String' && response.image !== '') {
     console.log('String exists and is not empty')
   }

    return (
        <div>
           {response === null &&(<Spinner/>)}
            {response &&(
                <div className='modal'>
                <div className='popup'>
                    <h1>{response.result.name}</h1>
                    <h5>{response.result.description}</h5>
                    {(response.image === "Error") &&(
                        <p className="text">{response.result.detailedDescription.articleBody}</p>
                    )}
                   {response.image && (response.image !== "Error") &&(
                     <div className="container">
                                <div className="left">{response.result.detailedDescription.articleBody}</div>
                        <div className="right"><img className="image" alt="image" src={response.image}/></div>
                     </div>
                   )}
                   {response.result.image &&(
                     <div className="container">
                        <div className="left">{response.result.detailedDescription.articleBody}</div>
                        <div className="right"><img className="image" alt="image" src={response.result.image.contentUrl}/></div>
                     </div>
                   )}
                   <button onClick={ () => { close(false) }}>close me</button>
                </div>
              </div>
            )}
        </div>
   );
}

export default Modal;