const DynPut: FC<Props> = Props => {
const [value, setValue] = useState<string>(['1', '2', '3', '4']);
return (
<View>
{value.map(v => {
<Text>{v}</Text>;
})}
</View>
);
};
Unable to get the values 1-5 on the screen. am using typescript and also saved the file with .tsx extension
map() expects a return value, there are multiple possibilities, for example:
const data = [{ x: 55, y: 34 }, { x: 75, y: 12 }];
const result1 = data.map(d => d.x); // inline
const result2 = data.map(d => (
d.x // use round brackets
));
const result3 = data.map(d => {
return d.x; // use return statement
});
console.log(result1, result2, result3);The last method is handy if you want to do something with the data before returning a value.
const data = [{ x: 55, y: 34 }, { x: 75, y: 12 }];
const result = data.map(d => {
const xTimesFive = d.x * 5; // do something with the x value
const dividedByTwo = xTimesFive / 2;
return dividedByTwo;
});
console.log(result);
// note, a simple calculation or check can also be done in the other methods
console.log(data.map(d => d.x > 60 ? "big" : "small"));The syntax for the map is wrong, use normal brackets instead:
{value.map((v) => (
<Text>{v}</Text>
))}