HTML中使用Vue.js的方法十分簡單。Vue.js是一個輕量級JavaScript框架，通過它可以實現動態數據綁定和組件化視圖。在HTML中使用Vue.js的第一步是導入Vue.js的JavaScript文件。

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

接著，在HTML中需要創建Vue實例，以便在頁面中渲染Vue組件。下面是一個Vue實例的例子：

<div id="app">
{{ message }}
</div>
<script>
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
})
</script>

在這個例子中，我們創建了一個Vue實例，并將其綁定到一個頁面元素中（id為“app”的元素）。Vue實例中包含一個data屬性，其中包含一個message屬性。通過使用雙括號，在頁面中輸出message屬性的值。

除了數據綁定外，Vue還提供了一系列的指令（Directives）來處理DOM元素（比如，v-if、v-show、v-for、v-bind等）。這些指令可以通過在HTML標簽中使用v-前綴來調用。Vue指令的使用方法如下：

<div id="app">
<p v-if="showMessage">Hello Vue.js!</p>
</div>
<script>
var app = new Vue({
el: '#app',
data: {
showMessage: true
}
})
</script>

在這個例子中，我們使用了v-if指令來判斷showMessage屬性的值是否為true。當showMessage為true時，頁面中顯示“Hello Vue.js!”；當showMessage為false時，該段內容被隱藏。這樣我們就可以根據不同的數據狀態靈活控制頁面內容的顯示和隱藏。