在 React Native 中呈现逗号分隔的值字符串

Question

我正在从 JSON 中提取 {item.dosage}，它会给出以下字符串

"300gr short pasta, 2 spring onions, 50gr parmesan cheese"

并且我想在单独的文本行中用逗号分隔显示每种成分，如下所示

   300gr short pasta
   2 spring onions
   50gr parmesan cheese

我试图在我的 JSX 中执行以下操作

{item.dosage.map((step, i) => (
        <Text>
            {i > 0 && ", "}
               {step}
        </Text>
 ))}

我收到关于“undefined is not a function...”的错误。

Answer 1

乍一看，它看起来很接近你要找的东西这样你就可以根据需要给视图留出边距..

{item.dosage.split(', ').map((step, i) => (
  <View>
      <Text>
        {i > 0 && ", "}

         {step}
      </Text>
  </View>
 ))}

Answer 2

const str = "300gr short pasta, 2 spring onions, 50gr parmesan cheese"

...
<Text>
  {str.split(',').map((step)=> <Text>{step}{",\n"}</Text>)}
</Text>
...

// so try this way
<Text>
 {item.dosage.split(',').map((step)=> <Text>{step}{",\n"}</Text>)}
</Text>

在 React Native 中呈现逗号分隔的值字符串

Rendering a comma separated string of values in React Native

reactjs

string

react-native

split

array.prototype.map