react-native 中的循环

Question

我想根据用户选择的玩家数量制作一个字段列表。我想做这样的事情：

 generatePaymentField() {
    var noGuest = this.state.guest;
    var payment =
    <View>
        <View>
            <View><Text>No</Text></View>
            <View><Text>Name</Text></View>
            <View><Text>Preference</Text></View>
        </View>;

    for (var i=0; i < noGuest; i++) {
        payment = payment +
            <View>
                <View>
                    <TextInput />
                </View>
                <View>
                    <TextInput />
                </View>
                <View>
                    <TextInput />
                </View>
            </View>;
    }
    return payment;
}

render () {
    var payment = this.generatePaymentField();
    this.setState({payment : payment});
    return (
        <View>
            {this.state.payment}
        </View>;
    )
}

但是 react-native 将上面的语法视为指向 for 循环行的“意外标记”。有没有其他方法可以做到这一点？

原文由 Kelvin Aliyanto 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

这应该工作

 render(){

	var payments = [];

	for(let i = 0; i < noGuest; i++){

		payments.push(
			<View key = {i}>
				<View>
					<TextInput />
				</View>
				<View>
					<TextInput />
				</View>
				<View>
					<TextInput />
				</View>
			</View>
		)
	}

	return (
		<View>
			<View>
				<View><Text>No</Text></View>
				<View><Text>Name</Text></View>
				<View><Text>Preference</Text></View>
			</View>

			{ payments }
		</View>
	)
}

原文由 vinay 发布，翻译遵循 CC BY-SA 3.0 许可协议