Return 来自 Firebase React 组件的 map()?
Return map() from a Firebase React Component?
我希望组件 ItemsFromDB 迭代我的 Firebase 实时数据库 中“内容”引用下的对象的内容。但是我怎样才能使这个组件成为 return 我想要的 map()
函数,因为它在快照箭头函数中?
function ItemsFromDB () {
return (
let ref = firebase.database().ref('content')
ref.child(name).on('value', function (snapshot) {
snapshot.map((childSnapshot) =>
<h2>{childSnapshot.val().name}</h2>
)
})
)
}
谢谢!
类似的东西
function ItemsFromDB () {
const [names, setNames] = React.useState(null);
React.useEffect(() => {
const ref = firebase.database().ref('content').child('name');
const callback = snapshot => (
setNames(snapshot.map(child => child.val().name))
);
ref.on('value', callback);
return () => {
ref.off('value', callback);
};
}, []);
if (!names) return null;
return (
<React.Fragment>
{names.map(name => <h2>{name}</h2>)}
</React.Fragment>
);
}
我希望组件 ItemsFromDB 迭代我的 Firebase 实时数据库 中“内容”引用下的对象的内容。但是我怎样才能使这个组件成为 return 我想要的 map()
函数,因为它在快照箭头函数中?
function ItemsFromDB () {
return (
let ref = firebase.database().ref('content')
ref.child(name).on('value', function (snapshot) {
snapshot.map((childSnapshot) =>
<h2>{childSnapshot.val().name}</h2>
)
})
)
}
谢谢!
类似的东西
function ItemsFromDB () {
const [names, setNames] = React.useState(null);
React.useEffect(() => {
const ref = firebase.database().ref('content').child('name');
const callback = snapshot => (
setNames(snapshot.map(child => child.val().name))
);
ref.on('value', callback);
return () => {
ref.off('value', callback);
};
}, []);
if (!names) return null;
return (
<React.Fragment>
{names.map(name => <h2>{name}</h2>)}
</React.Fragment>
);
}