为什么我们不能将布尔值作为响应中的道具传递,它总是要求字符串在我的代码中传递?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (149)

即使我已经应用了proType验证,但当为hasvacancy。报错如下:

Error: 'SyntaxError: JSX value should be either an expression or a quoted JSX text'

我知道我正在传递一个字符串类型值,用于“hasspace”支柱,但是我需要做什么,这样我就可以通过这个支柱传递一个布尔数据类型或其他数据类型。

import React from 'react';
import { render } from 'react-dom';


class VacancySign extends React.Component{

  render() {
    console.log('------------hasvacancy------', this.props.hasvacancy);
    if(this.props.hasvacancy) {
      return(
        <div>
          <p>Vacancy</p>
        </div>
      );
    } else {
      return(
        <div>
          <p>No-Vacancy</p>
        </div>);
    }

  }
}

VacancySign.propTypes ={
  hasvacancy: React.PropTypes.bool.isRequired
}

render(<VacancySign hasvacancy='false'/> , 
document.getElementById('root'));
提问于
用户回答回答于

应将布尔值括在{}中:

render(<VacancySign hasvacancy={false}/> , document.getElementById('root'));
用户回答回答于

不要试图将布尔值作为属性值传递。相反,只需将它们的存在或不存在作为您的布尔值:

render(<VacancySign hasVacancy />, document.getElementById('root'));

还请确保更新您的protype以使hasVacancy不需要:

VacancySign.propTypes ={
    hasVacancy: React.PropTypes.bool
}

所属标签

可能回答问题的人

  • 西风

    renzha.net · 站长 (已认证)

    9 粉丝1 提问5 回答
  • uncle_light

    5 粉丝518 提问3 回答
  • 学生

    2 粉丝477 提问3 回答
  • 军哥

    重庆雷驰信息技术有限公司 · 经理 (已认证)

    5 粉丝1 提问3 回答

扫码关注云+社区

领取腾讯云代金券