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

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

如何在nextjs中通過其他元素的onClick修改元素?

如何在nextjs中通過其他元素的onClick修改元素?

哈士奇WWW 2021-05-19 17:13:17
import Link from 'next/link';function myClick(e){  console.log(e);}const Index = () => (        <section className="min-vh-100">            <div className="input_bar border rounded-maximum p-1 mx-1 bg-white d-flex">                <input className="myButton submit_bar text-black" placeholder="Insert your input&hellip;"/>                <Link href="#"><a onClick={myClick} className="input_icon"></a></Link>            </div>        </section>);我正在使用nextjs,并且試圖通過另一個div中的click函數來更改div的類,我找不到如何執(zhí)行此操作的示例,因此我可以理解它的工作原理。謝謝你。
查看完整描述

2 回答

?
慕沐林林

TA貢獻2016條經驗 獲得超9個贊

這是使用引用的示例:


import Link from 'next/link'


const Index = () => {

  let myDiv = React.createRef()


  function myClick() {

    myDiv.current.classList.add('add-this-class')

  }


  return (

    <section className="min-vh-100">

      <div

        ref={myDiv}

        className="input_bar border rounded-maximum p-1 mx-1 bg-white d-flex"

      >

        <input

          className="myButton submit_bar text-black"

          placeholder="Insert your input&hellip;"

        />

        <Link href="#">

          <a onClick={myClick} className="input_icon" />

        </Link>

      </div>

    </section>

  )

}

了解我在這里做什么。我正在使用此行創(chuàng)建參考:


let myDiv = React.createRef()

然后,將其分配給要訪問的元素,在示例中,將其分配給div:


<div ref={myDiv} className="..." >

在onClick函數上,我訪問div并添加一個類:


myDiv.current.classList.add('add-this-class')

讓我知道這是否適合您。(如果確實如此,則感謝Abderrahman)


查看完整回答
反對 回復 2021-05-27
?
qq_花開花謝_0

TA貢獻1835條經驗 獲得超7個贊

我用鉤子。


const Index = () => {

    const [className, setClassName] = useState("")


    const myClick = () => {

        setClassName("some-class")

    }


    return (

        <div>

            <button onClick={myClick}>Click me</button>

            <div className={className}>Classname gets changes</div>

        </div>

    )

}


查看完整回答
反對 回復 2021-05-27
  • 2 回答
  • 0 關注
  • 367 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號