代码之家 › 专栏 › 技术社区 › Siya Mzam

为什么react native返回相当于布尔值的字符串?

react-native

-1

Siya Mzam · 技术社区 · 6 年前

我正在评估一些变量,并使用结果有条件地呈现元素。

这是评估

const condition = this.props.badgeCount > 0

用这样的结果

<View>
  {condition && (
    <View>
      <Text>
        {this.props.badgeCount}
      </Text>
    </View>
  )}
</View>

RN因错误而失败

文本字符串必须在文本组件中呈现

当我改变的时候工作得很好 condition 到

const condition = Boolean(this.props.badgeCount > 0)

很明显,返回的结果是 "true" 或 "false" .

我的问题是这是为什么,因为这显然是一个应该返回布尔值的评估,而且还有一种方法可以解决这个问题,而不是我正在使用的方法?

1 回复 | 直到 6 年前

nbokmans 6 年前

这是因为您要做的是有一个内联if语句。任何不是空字符串的字符串, null 或 undefined 是真正的价值( https://developer.mozilla.org/en-US/docs/Glossary/Truthy )

您可以通过进入浏览器控制台并执行以下操作来轻松测试:

console.log('someString' ? true : false);
console.log('' ? true : false);

你可以通过做来解决你的问题 !!condition 它将字符串值转换为布尔值,因此不会触发 text strings must be rendered within a text component 错误:

<View>
    {!!condition && (
        <View>
        <Text>
            {this.props.badgeCount}
        </Text>
        </View>
    )}
</View>

有关的详细信息 !! (不是)在这个答案中: https://stackoverflow.com/a/784946/3061857

推荐文章

user19476497 · 如何使用useState修改数组以使其成为React中的常数

2 年前

Muhammad Ashraf · 反应:过滤从具有特定键的对象数组中获取值,并将结果分组到数组中

2 年前

John · 如何确定Javascript自引用循环是否完成[重复]

2 年前

Herc · 将用户信息添加到firebase(注册)react native

2 年前

Bonhart · 有没有更好的方法按名称查找数组中的特定对象?

2 年前

ubermo · 如何在React本机自定义组件中使用状态?

2 年前

ramanujans alkhazarim · 错误“元素类型无效”React Native

2 年前

Audrey K · 有没有办法降级React Native?

2 年前

user15137953 · 已求解的对象作为React子对象无效。如果要渲染子级集合,请改用数组。反应

2 年前

Tedi · 如何将单个数据从子组件传递到父组件?

2 年前