我想根据用户 Select 的播放机号码列出一个字段列表.我想做这样的东西:

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循环行的"意外标记".有没有其他方法可以让我做到这一点?

推荐答案

这应该管用

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>
	)
}

React-native相关问答推荐

无法读取 @react-native-async-storage/async-storage 的未定义属性setItem

什么是 expoClientId?

TextInput 中的大写文本 - react native

如何获取 React Native 应用程序的崩溃日志(log)?

如何在 React Native 中创建和保存 CSV 文件?

React Native localhost 另一个调试器已经连接

React 中的 getSnapshotBeforeUpdate() 是什么?

Animated.View 的样式props的Typescript定义

使用来自另一个页面的 fetch 调用函数返回结果值

如何在 React Native Android 中设置按钮的高度

React Native Image 不显示,我该如何解决?

对未计算文件的本机Bundle sha-1 做出react(无法从assets index.android.bundle 加载脚本)

React Native - 如何从推送通知中打开路由

react-native:多色文本视图

你好世界! React Native 程序在 Mac 上抛出Could not parse the simulator list output

React Context:TypeError:render is not a function

如何将 jest 测试移动到 /test 文件夹并让它们运行?

如何升级 react-native gradle 版本

react-navigation 标题有一条微弱的线

NavigationActions.reset 不是函数吗?