React - 组件不会在foreach循环中呈现?

时间:2017-10-15 08:34:29

标签: reactjs typescript react-router

当你打开一个标签时,我有一个小应用程序,React Route重定向到给定的组件(容器)。从容器我想渲染子组件。我使用foreach循环遍历一个列表,其中包含需要给孩子的道具。但是,孩子没有得到渲染。

我不想使用map,因为我使用依赖于列表类的库。

render() {   
    return ( 
        <div>
            {this.state.list.ForEach((element) => 
                <ChildComponent childName={element.name} 
        }
        </div> 
    );
}

}

1 个答案:

答案 0 :(得分:18)

您将Array.forEachArray.map混淆。 reservados = ['FOR','AND','OR','NOT','XOR', 'INT', 'FLOAT', 'DOUBLE', 'SHORT','LONG', 'BOOL'] tokens = reservados + [ 'ID', 'NUMBER', 'PLUS', 'MINUS', 'TIMES', 'DIVIDE', 'DIVE', 'ASSIGN', 'LT', 'MA', 'LTE', 'MAE', 'DIF', 'PA', 'PC', 'ANDC', #'ORC', 'NOTC', 'MOD', 'CMP', 'END', 'COMMA', 'CA', 'CC', #'ES' ] t_ignore = ' \t' t_ignore_WHITESPACES = r'[ \t]+' t_PLUS = r'\+' t_MINUS = r'-' t_TIMES = r'\*' t_DIVIDE = r'/' t_ASSIGN = r'=' t_LT = r'<' t_MA = r'>' t_LTE = r'<=' t_MAE = r'>=' t_DIF = r'\!=' t_PA = r'\(' t_PC = r'\)' t_ANDC = r'\&&' #t_ORC = r'\||' t_NOTC = r'\!' t_DIVE = r'\\' t_MOD = r'\%' t_CMP = r'==' t_END = r'\;' t_COMMA = r'\,' t_CA = r'{' t_CC = r'}' #t_ES = r'\ ' def t_newline(t): r'\n+' t.lexer.lineno += len(t.value) def t_ID(t): r'[a-zA-Z_][a-zA-Z0-9_]*' """ CONVIERTE CUALQUIER IDENTIFICADOR EN MAYUSCULA EN CASO DE QUE SE HAYA ESCRITO ASÍ """ if t.value.upper() in reservados: t.value = t.value.upper() t.type = t.value return t def t_NUMBER(t): r'\d+' t.value = int(t.value) return t def t_error(t): print ("Error de sintaxis '%s'" % t.value[0]) t.lexer.skip(1) def buscarFicheros(directorio): ficheros = [] numArchivo = '' respuesta = False cont = 1 for dirName, subdirList, fileList in os.walk(directorio): #print('Directorio encontrado: %s' % dirName) for fname in fileList: ficheros.append(fname) for file in ficheros: print ("",cont,".",file) cont = cont + 1 while respuesta == False: numArchivo = input('\nNumero del archivo: ') print (numArchivo) for file in ficheros: if file == ficheros[int(numArchivo) - 1]: respuesta = True break print ("Escogido el archivo" + ficheros[int(numArchivo) - 1]) return ficheros[int(numArchivo) - 1] directorio = r'C:/Users/Carlos/Desktop/for c++/' archivo = buscarFicheros(directorio) test = directorio + archivo fp = codecs.open(test, "r", "utf-8") cadena = fp.read() fp.close() analizador = lex.lex() analizador.input(cadena) while True: tok = analizador.token() if not tok : break print (tok) 不返回任何内容。正确的方法是:

forEach

<div> {this.state.list.map((element, index) => <ChildComponent key={index} childName={element.name} /> )} </div> 将给定的map转换为另一个元素,在这种情况下是一个组件。调用element的结果是随后呈现的组件数组。 map始终返回forEach,因此代码的结果与写入相同:

undefined

请注意,在渲染组件列表时,<div> {undefined} </div> 也是必需的。