Question

React v0.14支持pure functional components（即相同的输入等于相同的输出）。道具作为函数参数传入。

sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)

try:
    sock.connect((HOST, PORT))

    while True:
        data = raw_input()
        sock.sendall(data + "\n")
        received = sock.recv(1024)
        print "{}".format(received)
finally:
    sock.close()

但是如何渲染PureComponent的子项？在常规有状态组件中，您使用this.props.children访问子项，但这显然不适用于此。

// Using ES6 arrow functions and an implicit return:
const PureComponent = ({url}) => (
  <div>
    <a href={url}>{url}</a>
  </div>
);

// Used like this:
<PureComponent url="http://www.google.ca" />

// Renders this:
<a href="http://www.google.ca">http://www.google.ca</a>

我该怎么办？

Answer 1

您需要将children添加到参数“props”的解构赋值中。

const PureComponent = ({url, children}) => (...)

children只是传递给组件的道具。为了像使用props.url一样使用它，你需要将它添加到该列表中，以便它可以“拉出”道具对象。

在纯ReactJS（功能）组件中渲染子道具

1 个答案: