線上 VueJS 編輯器——編寫、執行及共享程式碼

<html> <head> <title>VueJs 演示示例</title> <script src="https://unpkg.com/vue@3"></script> </script> </head> <body> <h1 id="app">{{ message }}</h1> <script> const { createApp } = Vue createApp({ data() { return { message: 'Hello Vue!' } } }).mount('#app') </script> </body> </html>

使用此線上 VueJS 編輯器（VueJS 版本 (2.5.3)）直接從瀏覽器直接編輯、執行和共享你的 Vuejs 程式碼。此線上編譯器為你提供了使用最新版本的 VueJS (2.5.3) 編輯和編譯 Vuejs 程式碼的便利性。

如何使用線上 VueJS 編輯器？

編寫並執行程式碼

在“原始碼”選項卡下直接編寫（或貼上）你的程式。
如果你想儲存你的程式，請轉至“專案”選單並儲存它。
你可以不儲存直接執行程式，只需點選“執行”按鈕即可。

如何輸入使用者輸入？

最新版本的線上 VueJS 編輯器允許在執行期從終端視窗提供程式輸入，與你在自己的計算機上執行程式的方式完全相同。因此，只需執行程式，然後從右側提供的終端視窗提供你的程式輸入（如果有的輸入）。

鍵盤快捷鍵

以下是我們編輯器的關鍵字快捷方式

快捷方式	說明
⌘ + Enter	執行程式
⌘ + S	儲存專案（需要登入）
⇧ + ⌘ + S	另存為專案
⌘ + P	新建專案
⌘ + G	共享專案
⌘ + Z	撤消編輯
⌘ + Y	重做編輯
⌘ + A	全選文字
⌘ + X	剪下選中文字
⌘ + C	複製選中文字
⌘ + V	貼上複製的文字
⌘ + F	搜尋文字
⌘ + ⌥ + F	替換文字

快捷方式	說明
Ctrl + Enter	執行程式
Ctrl + S	儲存專案
Shift + Ctrl + S	另存為專案
Ctrl + G	共享專案
Ctrl + Z	撤消編輯
Ctrl + Y	重做編輯
Ctrl + A	全選文字
Ctrl + X	剪下選中文字
Ctrl + C	複製選中文字
Ctrl + V	貼上複製的文字
Ctrl + F	搜尋文字
Ctrl + H	替換文字

儲存並分享專案程式碼

線上儲存 Vuejs 專案

你可以在我們這裡儲存你的 Vuejs 專案，以便你以後可以訪問該專案。要儲存專案，你需要在我們這裡建立一個登入 ID。因此，在你儲存專案之前，請使用本頁右上角給出的連結建立一個登入 ID。

線上共享 Vuejs 專案

你可以使用此功能與老師、同學和同事共享你的 Vuejs 程式碼。只需點選共享按鈕，它就會建立一個短連結，可以透過電子郵件、WhatsApp 甚至社交媒體進行共享。如果一個共享連結三個月內一直處於被動狀態，它將被刪除。

編輯器的更多功能

主題——你可以從“設定”選單的“編輯器主題”選項更改當前編輯器的主題。
字型大小——你可以從“設定”選單的“字型大小”選項更改編輯器/編譯器的字型大小。
**縮排寬度** – 您可以從“設定”選單中的“縮排寬度”選項更改縮排寬度。
**顯示/隱藏行號** – 您可以從“設定”選單中的“顯示行號”或“隱藏行號”選項顯示/隱藏程式碼中的行號。
以及更多其他功能。

為什麼使用線上 VueJS 編輯器？

使用線上 VueJS 編輯器執行 Vuejs 程式碼有以下好處

跨平臺：無論何種作業系統，您都可以從任何裝置執行程式碼。
便利：無需安裝任何軟體即可使用它。
無需安裝：執行程式碼時無需額外安裝。
版本更新：我們的線上編譯器/編輯器/終端都是最新版本。