Vue中有一個內置的指令v-show可以控制元素的顯示和隱藏。但是有時候我們需要更加靈活的控制元素的顯示和隱藏，這時候就需要使用Vue的另一個指令v-if和v-else-if。這兩個指令會根據條件來控制元素是否渲染到頁面中，從而實現元素的顯示和隱藏。

但是有時候我們需要控制元素的可見性，而非控制元素是否渲染到頁面中。這時候v-show和v-if就無法勝任了，而需要使用Vue中提供的另一個方法——hide。

export default {
data() {
return {
show: true
}
},
methods: {
handleHide() {
this.$refs.box.hide()
},
handleShow() {
this.$refs.box.show()
}
}
}

在上面的代碼中，我們在methods中定義了handleHide和handleShow兩個方法。這兩個方法分別調用了一個名為hide和show的方法。這個方法是在組件中定義的，需要使用ref獲取到組件的實例之后，再通過實例的方法來調用hide和show。

接下來看一下組件內部的代碼：

export default {
methods: {
hide() {
this.$el.style.display = 'none'
},
show() {
this.$el.style.display = 'block'
}
}
}

在組件的方法中，我們定義了hide和show兩個方法。這兩個方法分別控制了組件的可見性，將其設置為不可見和可見狀態。這里我們是通過設置組件DOM元素的樣式來控制組件的可見性。

總結一下，使用Vue中的hide方法可以更加靈活地控制組件的可見性。通過在組件內部定義hide和show方法，再通過組件實例的方式來調用這些方法，我們就可以達到控制組件可見性的效果。