首先,我已经浏览了我的代码并且没有看到我可能会多次初始化应用程序的任何地方(除非我遗漏了一些东西)。
我知道之前有人问过并回答过这个问题,但我不确定如何将解决方案应用于我自己的代码,因为我刚刚开始使用 Firebase。
我得到的错误是:名为“[DEFAULT]”的 Firebase 应用程序已经存在(应用程序/重复应用程序)。
这是我的配置组件:
export const DB_CONFIG = {
apiKey: "AIzaSyDj_UQoRkOWehv-Ox2IAphOQPqciE6jL6I",
authDomain: "react-notes-38f8a.firebaseapp.com",
databaseURL: "https://react-notes-38f8a.firebaseio.com",
projectId: "react-notes-38f8a",
storageBucket: "react-notes-38f8a.appspot.com",
messagingSenderId: "1063805843776"
};
Run Code Online (Sandbox Code Playgroud)
这是 App.js
constructor(props){
super(props);
this.app = firebase.initializeApp(DB_CONFIG);
this.database = this.app.database().ref.child('notes')
this.state = {
notes: [
],
}
}
componentWillMount(){
const previousNotes = this.state.notes;
this.database.on('child_added', snap => {
previousNotes.push({
id: snap.key,
noteContent: snap.val().noteContent
})
})
this.setState({
notes: previousNotes
})
}
Run Code Online (Sandbox Code Playgroud) 我有三个组成部分;表单、预览和 AppStore。单击表单中的按钮会将商品添加到商店。这似乎工作正常,除了预览组件中的列表在商店更改时不会更新/重新渲染,即使它有一个 @observer 装饰器。我缺少什么?
表单有一个按钮和处理函数,用于将项目添加到商店:
@inject('AppStore')
@observer class Form extends React.Component{
handleAddItem= (item) =>{
const {AppStore} = this.props;
AppStore.addItem(item);
console.log(AppStore.current.items)
}
render(){
return(
<button onClick={() => this.handleAddItem('Another Item')}>Add Item</button>
)}
}
Run Code Online (Sandbox Code Playgroud)
通过项目预览地图(我正在使用拖放功能,因此我的代码可能看起来有点奇怪)
@inject('AppStore')
@observer class Preview extends React.Component
Run Code Online (Sandbox Code Playgroud)
...
return(
<ul>
{items.map((value, index) => (
<SortableItem key={`item-${index}`} index={index} value={value} />
))}
</ul>)
Run Code Online (Sandbox Code Playgroud)
...
return <SortableList items={AppStore.current.items} onSortEnd={this.onSortEnd} />;
Run Code Online (Sandbox Code Playgroud)
这里是商店:
import { observable, action, computed } from "mobx";
class AppStore {
@observable other = {name: '', desc:'', items: [ 'item 1', …Run Code Online (Sandbox Code Playgroud) 我有一系列的人对象。当添加一个新人时,函数应该检查是否已经添加了具有该名字的人。如果是这样,该对象应替换为新对象。如果新人还没有被添加,那么他们只是被添加到最后。这样做的最佳方法是什么?
这是对象
const people = [
{name: Joe M, town: London},
{name: Julie A, town: London},
{name: Sally N, town: Edinburgh},
{name: Max M, town: Liverpool}
]
Run Code Online (Sandbox Code Playgroud)
这是我尝试过的
for(let key in people) {
if(people[key].name === newPerson.name){
people.splice(key, 1, newPerson)
} else {
this.people.push(this.newPerson)
}
}
Run Code Online (Sandbox Code Playgroud)