为什么不显示渲染数据?

时间:2019-10-04 11:29:23

标签: javascript arrays reactjs for-loop

大家好,我正在创建一个反应页面,在这里我想显示在this.state中设置的try变量的数据,但要在页面上显示名称数组值**(即显示值)**,但不是能够显示出来,但在控制台中会显示display的值

import React, { Component } from 'react'
import axios from 'axios'

class Form extends Component {
    constructor() {
        super();
        this.state = {
            response: [],
            change: [],
            name: [],
            fullname:[],
            try:[],//please see the link in below to see the value of try 

        }
    }

    renderData() {
        return (this.state.try).map((item, index) => {
            const name = item.possible_persons
            let x = ""
            let y = ""
            for (x of name) {
               // console.log(x.names)
                for (y of x.names) {
                    //console.log(y.display)
                    const name = y.display
                    console.log('names',name)
                    //const dis = y.display
                    this.setState({
                        name: x.names.map((X) => x.names)
                    })
                    console.log(this.state.name,'state value')
                }
            }
            return (
                <li>{this.state.name}</li>
            )
        })
    }

    handleAll = (e) => {
        this.setState({ [e.target.name]: e.target.value }) // using this we get the form value from name attribute and display it on alert
        console.log(e.target.value)
    }

    render() {
        return (
            <div className="container">
                <div>
                    <li>    {this.state.try.map((item, index) => <div key={index}>{`change: ${item.possible_persons}  `}</div>)}</li>
                    <li>    {this.state.try.map((item, index) => <div key={index}>{`change: ${item.possible_persons[2].names[0].first}  `}</div>)}</li>
                </div>
               <li> {this.state.name.map((z, index) => { z.display })}</li>
            </div>
            )
    }
}
export default Form;

请参见下面的链接

尝试值:-https://github.com/pradeepgorule/react/blob/master/error%20file

整个代码:-https://github.com/pradeepgorule/react/blob/master/error%20code

所以请告诉我应该在哪里更改代码

2 个答案:

答案 0 :(得分:1)

您还需要渲染嵌套字段:

function liveassets(){
 return $this->hasMany('assets')->where('enabled','=', 1);
}

return [
    'id' => $this->id,
    'name' => $this->name,
    'description' => $this->description,
    'enabled' => $this->enabled,
    'sticky' => $this->sticky,
    'created_at' => $this->created_at,
    'updated_at' => $this->updated_at,
    'asset_count' => $this->liveassets->count(),
    'assets' => $this->liveassets,
];

答案 1 :(得分:-2)

无论何时使用构造函数,都应调用super !!!

constructor(props) {
  super(props);
  // then do whatever u want
}