React Native中如何将数组显示为逗号分隔的字符串？

你现在用JSON.stringify()处理数组后，显示的内容会带括号和引号（比如["valueOne", "valueTwo"]），这显然不是你想要的效果对吧？其实解决这个问题超简单，直接用JavaScript数组自带的join()方法就能搞定！

这个方法可以把数组里的元素用你指定的分隔符拼接成字符串，完全匹配你要的「valueOne, valueTwo, valueThree」格式。修改后的代码如下：

let currentWorkout = this.props.currentWorkout;
// 用join(', ')将数组元素以逗号加空格分隔成字符串
let tools = currentWorkout.tools.join(', '); 

return (
  <View style={styles.container}>
    <WorkoutDetail 
      workout={this.props.currentWorkout} 
      workoutImage={currentWorkout.workoutImage} 
      onPressWorkout={() => alert("CONTINUE WORKOUT")} 
    />
    <View style={styles.workoutInfo}>
      <KeyValueText header="Tools" value={tools} />
    </View>
  </View>
);

另外，为了避免数组为空或者currentWorkout.tools不存在时出现报错，你可以加个可选链和默认值，让代码更健壮：

// 若tools不存在或为空，显示默认提示文本
let tools = currentWorkout?.tools?.join(', ') || 'No tools required';

内容的提问来源于stack exchange，提问作者Shashika Virajh