Question

我有这样的组件

class Hourly extends Component {
  render() {
    return (
      <div key={this.props.key} id={this.props.id} className="col-xs-3 text-center vcenter box parent">
        <div className="child">
          <div>{this._theDay(this.props.day)}</div>
          <div>{this.props.summary}</div>
        </div>
      </div>
    );
  }
}

我想在我稍后在另一个组件中使用的组件中使用自定义函数（_theDay）

自定义功能：

_theDay(time) {
   moment.locale('en-gb');
   var dateTime = moment(time*1000).format('dddd');
   return dateTime;
  }

我稍后用

调用该组件

        <Hourly
          key={hour.time}
          id={hour.time}
          day={hour.time}
          summary={hour.summary}
        />

然而我收到错误：Uncaught (in promise) DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.(…)

当我使用<div>{this.props.day}</div>;时，一切正常，但我无法使用自定义功能

Answer 1

我认为这与React试图在道具改变后更新DOM有关。尝试使用绑定到<div/>的{{1}}上的密钥来帮助它知道孩子们已经发生了变化。

props.day

这里是documentation on reconciling the DOM.

使用自定义函数做出反应

1 个答案: