当前位置:  开发笔记 > 编程语言 > 正文

ReactJS:如何在单选按钮中使用布尔值?

如何解决《ReactJS:如何在单选按钮中使用布尔值?》经验,为你挑选了2个好方法。

在单选按钮中使用布尔数据的正确方法是什么.如果直接使用,这些值将从布尔值转换为字符串.

预加载的输入字段的JSON数据:

var question = [
  {value: true, name: "Yes"},
  {value: false, name: "Not this time"}
]

单选按钮字段:

 {this.state.question[0].name}
 {this.state.question[1].name}

onRadioChange的绑定:

onRadioChange: function(e) {
    console.log(e.target.value);
}

控制台日志显示所选值从布尔值转换为字符串.

处理这个问题的一种方法是在onRadioChange函数中添加一个额外的函数,将"true"/"false"字符串转换为布尔值,e.target.value但感觉有点麻烦.另外,仅使用'e.target.checked'将不起作用,因为在某些单选按钮组中,我有其他值而不是布尔值(需要通过).

一些通用且干净的解决方案是使用从REST转换为REST的常量值表.

是否有任何特殊的ReactJS方法可以做到这一点?也许不吧.



1> Pekka..:

目前解决方案是在保存之前将传递的属性从字符串值转换为布尔值.

var function = str2bool(value) {
   if (value && typeof value === 'string') {
     if (value.toLowerCase() === "true") return true;
     if (value.toLowerCase() === "false") return false;
   }
   return value;
}

并调用转换:

onRadioChange: function(e) {
    console.log(str2bool(e.target.value));
    // Here we can send the data to further processing (Action/Store/Rest)
}

通过这种方式,数据可以通过操作发送到Rest或Stores,并且可以直接使用单选按钮.



2> J. Mark Stev..:

对单选按钮使用输入的checked属性.该属性使用布尔值.


event.target.checked
推荐阅读
有风吹过best
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有