在使用Vue.js時，可以使用Vue.extend()方法創建一個子類，傳入參數包含了一個對象。其中，在extend中的data和vue實例化對象中的data寫法不一樣。下面利用實例說明，操作如下：

第一步，創建一個靜態頁面并引入vue.js文件，并在主體元素標簽中插入一個div，設置id屬性，如下圖所示：

第二步，在<script></script>標簽中調用Vue.extend()，設置template和data，如下圖所示：

第三步，使用new關鍵字調用$mount()，將創建的類掛載到div元素上，如下圖所示：

第四步，為了顯示變量的字體等樣式，需要添加相關的樣式屬性，這里使用:class，如下圖所示：

第五步，保存代碼并打開瀏覽器預覽界面效果，可是控制臺出現了錯誤警告，如下圖所示：

第六步，調整template標簽屬性嵌套，去掉多層標簽元素，只留一個div標簽；class前面的:去掉，如下圖所示：