我试图制作树形HTML。 （使用React）
这是Node类，它包含子节点。
.subscribeOn()但是，此代码将发生警告＆＃39;数组或迭代器中的每个子项应具有唯一的＆＃34;键＆＃34;道具。＆＃39 ;.
所以我在class SomeClass
private final PublishSubject<ExerciseQueryOptions> queryOptionsPublishSubject = PublishSubject.create();
@NonNull
@Override
public Observable<List<ExerciseViewModel>> call() {
return queryOptionsPublishSubject
.startWith(createQueryOptions())
.distinctUntilChanged()
.flatMap(new Function<ExerciseQueryOptions, ObservableSource<List<ExerciseViewModel>>>() {
@Override
public ObservableSource<List<ExerciseViewModel>> apply(ExerciseQueryOptions queryOptions) throws Exception {
//This is the code I want to run on a given scheduler,
//Supplied by the code that calls this .call() method.
return datastore.queryAll(ExerciseModel.class, true)
.map(transformer);
}
});
}
//Other class
SomeClass A;
A.subscribeOn(Schedulers.computation()).observeOn(AndroidScheduers.mainThread())
.subcribe(...);
旁边添加了class Node extends React.Component {
constructor(props) {
super(props);
this.state = {
children: []
};
}
render() {
return <div id={this.props.id} className="person">
<div className="info">
<div className="name">{this.props.name}</div>
</div>
<div className="childrenWrap">
<div className="children">
{this.state.children}
</div>
</div>
</div>;
}
addChild(node) {
this.setState({children: this.state.children.concat(node)});
}
}
//////////////
let tree = document.querySelector("#tree");
let root = ReactDom.render(<Person id="root" name="A" />, tree);
root.addChild(<Person id="child1" name="B" />);
root.addChild(<Person id="child2" name="C" />);
root.addChild(<Person id="child3" name="D" />);
但它没有解决我怎样才能解决这个问题？
答案 0 :(得分：2)
问题不在于您的父组件，而在于您的子组件
这可能会解决问题：
root.addChild(<Person id="child1" key="child1" name="B" />);
root.addChild(<Person id="child2" key="child2" name="C" />);
root.addChild(<Person id="child3" key="child3" name="D" />);
但在我看来，你正在以一种非常糟糕的方式解决问题 - 你不应该在你的state中保留整个渲染元素，只需要渲染它们所需的数据然后在render你应该创建树
答案 1 :(得分：1)
你的钥匙必须是独一无二的;为什么不将它设置为 id 的值？
root.addChild(<Person id="child1" key="child1" name="B" />);