問(wèn)題描述

有這樣一個(gè)簡(jiǎn)單的需求: 頁(yè)面有一個(gè)按鈕, 點(diǎn)擊會(huì)有一個(gè)彈窗, 彈窗上有個(gè)關(guān)閉按鈕, 點(diǎn)擊可以關(guān)閉這個(gè)彈窗

用vue的組件來(lái)做大約是這樣的

<component-parent>
    <component-child>
        ....我是內(nèi)容....
        <button>點(diǎn)我關(guān)閉</button>
    </component-child>
    
    <button>點(diǎn)我打開(kāi)</button>
</component-parent>

問(wèn)題出現(xiàn)的環(huán)境背景及自己嘗試過(guò)哪些方法

我的實(shí)現(xiàn)方式是這樣的:

• 打開(kāi)操作(父組件操作):

  show(){
      this.isShow = true
      .....做其他的事情....
  }
  hide(){
      this.isShow = false
  }

• 關(guān)閉操作(子組件操作):

     this.$parent.hide()

這樣做能實(shí)現(xiàn)功能, 但是就是不太優(yōu)雅, 因?yàn)檫@樣父組件必須實(shí)現(xiàn)子組件調(diào)用的方法/屬性, 耦合會(huì)很高

emit我也想過(guò), 但我覺(jué)得這樣更不好

你期待的結(jié)果是什么？實(shí)際看到的錯(cuò)誤信息又是什么？

希望能找到一個(gè)最優(yōu)解, 只在子組件里面做操作, 不依賴父組件, 謝謝!