我试图currentUser在 Hook 内部的函数中使用 的值useEffect,但该值似乎不是用户的对象,而我在使用它时希望它是用户的对象。这是代码:
function Chat() {
const currentUser = useAuth()
useEffect(() => {
const fetchParticipants = async () => {
console.log(currentUser.uid) // not defined
}
fetchParticipants()
}, [])
}
Run Code Online (Sandbox Code Playgroud)
这就是useAuth()正在调用的函数
export function useAuth() {
const [ currentUser, setCurrentUser ] = useState();
useEffect(() => {
const unsub = onAuthStateChanged(auth, user => setCurrentUser(user));
return unsub;
}, [])
return currentUser;
}
Run Code Online (Sandbox Code Playgroud) 我正在尝试构建一个与右侧对齐的粘性工具栏。但我无法让它与那一侧对齐:
如果我使用float: right;下面的元素,就会被拉起,如果我使用父容器,它会跨越整个屏幕宽度并使用,justify-content: end;并且使用z-index: 10;左右,该父元素的屏幕会被阻止。
那么如何才能最优雅地将元素对齐到右侧呢?
.container {
background-color: cyan;
height: 1000px;
}
.sticky-element {
position: sticky;
top: 20px;
}
.other-stuff {
padding: 20px;
}Run Code Online (Sandbox Code Playgroud)
<div class="container">
<div class="sticky-element">
<button>Button 1</button>
<button>Button 2</button>
</div>
<div class="other-stuff">
Some other stuff that is drawn up if float: right is applied on sticky-element.
(But shouldn't)
</div>
</div>Run Code Online (Sandbox Code Playgroud)