第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何在 React 的組件之間執(zhí)行作為 props 傳遞的函數(shù)?

如何在 React 的組件之間執(zhí)行作為 props 傳遞的函數(shù)?

白板的微信 2022-11-11 13:19:50
我有麻煩了。當我使用React創(chuàng)建注銷功能時,出現(xiàn)了問題。我的“Auth”組件將狀態(tài)和功能信息發(fā)送到“AuthMenu”組件。但是,此代碼中的注銷功能<Btn onClick={logout}>Logout</Btn>不起作用。當我檢查"AuthMenu"中的道具時,console.log(logout);很好地顯示了函數(shù)的代碼。但是,不工作..我寫錯代碼了嗎?.Auth.jsimport React, { Component } from 'react'import { GetUser } from '../../controllers/auth'class Auth extends Component {    state = {        info: {            id: '',            name: '',            img: '/icons/user.png',        },    }    handleSetAuth(data) {        this.setState({            info: {                id: data.user_id,                name: data.user_nickname,                img: '/icons/user.png',             }        });    }    handleDeleteAuth() {        console.log("Logout Successful!");        this.setState({            info: {                id: '',                name: '',                img: '/icons/user.png',            }        });    }    componentDidMount() {        if (localStorage.getItem('tk') !== null){            GetUser((data)=> {                if (this.state.info !== data)                this.handleSetAuth(data);            });        }    }    render() {        return (          <AuthMenu info={this.state.info} logout={this.handleDeleteAuth}></AuthMenu>        );    }}export default AuthAuthMenu.jsimport React from 'react'import styled from 'styled-components'...const Btn = styled.button`    position: relative;    display: inline-block;    float: right;    width: 100px;    height: 30px;    font-size: 0.8rem;    line-height: 30px;    margin: 15px 0 15px auto;    border-radius: 4px;    border: 1px solid #eee;    text-align: center;    cursor: pointer;    transition: .2s ${transition};    ${noselect}    &:hover,    &:active {        background-color: ${palette.gray8};        color: white;    }    ${media.small} {        width: 80px;    }`;
查看完整描述

4 回答

?
臨摹微笑

TA貢獻1982條經驗 獲得超2個贊

你的onClick是否正常工作,只是忽略了道具,有時點擊在某些組件上不起作用,你可以試試這個

              <Btn onClick={() => {console.log("clicked");
              logout()}}>Logout</Btn>


查看完整回答
反對 回復 2022-11-11
?
慕田峪7331174

TA貢獻1828條經驗 獲得超13個贊

我的問題解決了!

錯誤的原因是event.stopImmediatePropagation();。

Bug 的場景是這樣的。

  1. 單擊注銷按鈕。(退出按鈕包含在 Memu 組件中)

  2. 菜單組件的執(zhí)行事件。(菜單組件是主體包含的模態(tài)。)

  3. 停止事件傳播。

  4. 注銷按鈕無法使用。

我有這個錯誤超過 6 小時。這只是我的錯誤?。?!


查看完整回答
反對 回復 2022-11-11
?
犯罪嫌疑人X

TA貢獻2080條經驗 獲得超4個贊

在我的代碼中,只是樣式化組件。


這是不需要的操作的原因嗎?


import styled from 'styled-components'


const Btn = styled.button`

    position: relative;

    display: inline-block;

    float: right;

    width: 100px;

    height: 30px;

    font-size: 0.8rem;

    line-height: 30px;

    margin: 15px 0 15px auto;

    border-radius: 4px;

    border: 1px solid #eee;

    text-align: center;

    cursor: pointer;

    transition: .2s ${transition};

    ${noselect}


    &:hover,

    &:active {

        background-color: ${palette.gray8};

        color: white;

    }


    ${media.small} {

        width: 80px;

    }

`;


查看完整回答
反對 回復 2022-11-11
?
蝴蝶刀刀

TA貢獻1801條經驗 獲得超8個贊

你handleDeleteAuth的沒有綁定到組件。請?zhí)砑觢ogout={this.handleDeleteAuth.bind(this}或更改為箭頭功能:



    const handleDeleteAuth = () => {

        console.log("Logout Successful!");

        this.setState({

            info: {

                id: '',

                name: '',

                img: '/icons/user.png',

            }

        });

    }


查看完整回答
反對 回復 2022-11-11
  • 4 回答
  • 0 關注
  • 154 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網(wǎng)微信公眾號