前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >实现一个带后端服务的 Vue 项目,用云开发Vue插件!

实现一个带后端服务的 Vue 项目,用云开发Vue插件!

作者头像
腾讯云开发TCB
发布2020-06-03 15:18:46
8390
发布2020-06-03 15:18:46
举报
文章被收录于专栏:云开发
导语

云开发CloudBase作为一站式的云端一体化研发平台,为前端开发者提供了一站式的计算、存储、数据库、托管等服务;开发者可以通过云开发,快速开发出一个业务完善,性能强劲的 Web 应用,极大节约了研发的时间、人力和物力成本。

秉承“为开发者提供更好用的云服务”的服务宗旨,云开发团队推出云开发Vue插件,使用云开发Vue插件,开发者可以无需搭建服务器,一键实现Vue项目的服务端构建。

云开发 Vue 插件

云开发 Vue 插件 是云开发官方维护的 Vue 插件,提供全局入口、Vue 逻辑组件等功能。

如何使用

01.安装

在你的 Vue 项目中使用如下命令安装插件:

代码语言:javascript
复制
npm install --save @cloudbase/vue-provider

02.使用

下面我们使用 LoginState 组件,来动态绑定当前页面的登录态。

  • 页面初始化时,显示未登录
  • 之后我们调用匿名登录,如果登录成功,则文案将变成已登录
代码语言:javascript
复制
<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> 

03.其他组件

除了 Login State ,云开发的 Vue 组件还提供了其他一些组件,帮助你更好的开发应用。

LoginState

获取并绑定登录状态

DatabaseQuery

数据库查询

DatabaseWatch

数据库实时推送

CloudFile

获取云存储中的文件

关于这些组件的详细使用说明,你可以访问组件文档查看。

04.插件文档

更多使用说明,可以访问如下地址查看:

  • http://docs.cloudbase.net/cloudbase-vue/introduce.html
  • https://github.com/TencentCloudBase/cloudbase-vue

总结

Vue 插件的发布,可以大大降低开发者使用云开发开发应用的门槛,帮助开发者快速构建 Web 应用。无论你是要做活动营销页面,还是为你的小程序开发一个管理控制台,都可以轻松实现。

小调查

除了 Vue 插件以外,你还期待有什么插件呢?

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2020-05-15,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 腾讯云开发CloudBase 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 云开发 Vue 插件
  • 如何使用
    • 01.安装
      • 02.使用
        • 04.插件文档
        • 总结
        • 小调查
        相关产品与服务
        数据库
        云数据库为企业提供了完善的关系型数据库、非关系型数据库、分析型数据库和数据库生态工具。您可以通过产品选择和组合搭建,轻松实现高可靠、高可用性、高性能等数据库需求。云数据库服务也可大幅减少您的运维工作量,更专注于业务发展,让企业一站式享受数据上云及分布式架构的技术红利!
        领券
        问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档