快速實現一個帶後端服務的 Vue 項目，用雲開發Vue插件！

導語

雲開發CloudBase作爲一站式的雲端一體化研發平臺，爲前端開發者提供了一站式的計算、存儲、數據庫、託管等服務；開發者可以通過雲開發，快速開發出一個業務完善，性能強勁的 Web 應用，極大節約了研發的時間、人力和物力成本。

秉承“爲開發者提供更好用的雲服務”的服務宗旨，雲開發團隊推出雲開發Vue插件，使用雲開發Vue插件，開發者可以無需搭建服務器，一鍵實現VUE項目的服務端構建。

雲開發 Vue 插件

雲開發 Vue 插件 是雲開發官方維護的 Vue 插件，提供全局入口、Vue 邏輯組件等功能。

如何使用

安裝

在你的 Vue 項目中使用如下命令安裝插件

npm install --save @cloudbase/vue-provider

使用

下面我們使用 LoginState 組件，來動態綁定當前頁面的登錄態。

• 頁面初始化時，顯示 未登錄
• 之後我們調用匿名登錄，如果登錄成功，則文案將變成 已登錄

<template>
  <div id="app">
    <LoginState v-slot="{ loginState }">
      <h1>{{ loginState ? '已登錄' : '未登錄' }}</h1>
    </LoginState>
  </div>
</template>

<script>
import Vue from "vue"
import Cloudbase from "@cloudbase/vue-provider"

Vue.use(Cloudbase, {
    env: "your-env-id"
})

export default {
  async created() {
    // 以匿名登錄爲例
    await this.$cloudbase
      .auth({ persistence: "local" })
      .anonymousAuthProvider()
      .signIn()
  }
}
</script>

其他組件

除了 Login State ，雲開發的 Vue 組件還提供了其他一些組件，幫助你更好的開發應用。

LoginState	獲取並綁定登錄狀態
DatabaseQuery	數據庫查詢
DatabaseWatch	數據庫實時推送
CloudFile	獲取雲存儲中的文件

關於這些組件的詳細使用說明，你可以訪問組件文檔查看。

插件文檔

更多使用說明，可以訪問如下地址查看

• http://docs.cloudbase.net/cloudbase-vue/introduce.html

• https://github.com/TencentCloudBase/cloudbase-vue

總結

Vue 插件的發佈，可以大大降低開發者使用雲開發開發應用的門檻，幫助開發者快速構建 Web 應用。無論你是要做活動營銷頁面，還是爲你的小程序開發一個管理控制檯，都可以輕鬆實現。

小調查

除了 Vue 插件以外，你還期待有什麼插件呢？