如何使用列表呈现对象

时间:2018-04-28 19:07:53

标签: javascript node.js reactjs

我有一个带有列表的对象,我希望以echo file_get_contents("/stream/..");格式呈现它们,所以当用户向列表添加元素时,它会自动添加渲染,如何在Hobbies类

中打印obect <ul>表单

这是代码,

MyData

这是我渲染它的方式,

var Mydata = {
  name : 'David',
  hobby:[  'diving','traveling','Eating'],
}

3 个答案:

答案 0 :(得分:2)

将道具爱好传递给爱好组件。

import tensorflow as tf
from keras.models import Model
from keras.layers import Input, Lambda
import keras.backend as K
import numpy as np

def quantize(x):
    'Squashes x (0->1) to steps of 1/128'
    precision = 3
    base = 0.0078125 # 1/128
    x = K.clip( x, min_value = 0.0, max_value = 1.0 )
    return K.round( 1000 * ( base * K.round( x / base ) - 1.0 / 256 ) ) / 1000

a = Input( shape = ( 4, ) )
b = Lambda( quantize )( a )
model = Model( inputs = a, outputs = b )
print ( model.predict( np.array( [ [0.21940812, 0.7998919 , 0.5420448 , 0.33850232 ] ] ) ) )

答案 1 :(得分:1)

试试这个

return
    (<h3>My hobbies:</h3>
    <ul>
    this.props.level.map((Mydata.hobby, index) => (
        <li>className="indent" key={index}>
            {index}
        </li>
    ))
    </ul>
    );

答案 2 :(得分:1)

您可以使用map函数迭代数组并将列表创建为

class Hobbies extends React.Component {

  render() {
    var Mydata = {
  name : 'David',
  hobby:[  'diving','traveling','Eating'],
}
    return (
      <div>
        <h3>My hobbies:</h3>
        <ul>
          {Mydata.hobby.map(ele=> <li key={ele.toString()}>{ele}</li>)}
        </ul>
      </div>

    );
  }
}

ReactDOM.render(
  <Hobbies />,
  document.getElementById('root')
);

或者您可以将数据存储在组件的状态中,并可以使用如下

class Hobbies extends React.Component {
 constructor(){
   super();
   this.state = {
    name : 'David',
    hobby:[  'diving','traveling','Eating'],
  }
 }


  render() {

    return (
      <div>
        <h3>My hobbies:</h3>
        <ul>
          {this.state.hobby.map(ele=> <li key={ele.toString()}>{ele}</li>)}
        </ul>
      </div>

    );
  }
}

ReactDOM.render(
  <Hobbies />,
  document.getElementById('root')
);

如果myData是全局对象

class Hobbies extends React.Component {
  render() {
    return (
      <div>
        <h3>My hobbies:</h3>
        <ul>
          {Mydata.hobby.map(hobby => <li key={hobby}>{hobby}</li>)}
        </ul>
      </div>
    );
  }
}
var Mydata = {
  name : 'David',
  hobby:[  'diving','traveling','Eating'],
}
ReactDOM.render(
  <Hobbies/>,
  document.getElementById('root')
);