使用 Vue-TCB 快速在 Vue 应用中接入云开发的方法

什么是 Vue TCB

我自己平时经常会用到 Vue 来开发前端应用。所以，基于 Vue 的插件系统，封装了一个 Vue 插件。

如何使用

1. 安装 vue-tcb

执行如下命令，安装 vue-tcb

# npm
npm install --save vue-tcb
#yarn
yarn add vue-tcb

2. 在主文件中引入 vue-tcb

在你的 main.js 中加入如下代码

import * as Tcb from 'vue-tcb'
Vue.use(Tcb,{
 env: 'env-id'
})

在实际的使用过程中，需要将 env-id 替换为你的环境 id

3. 在 Vue 实例中调用云开发

引入插件以后，只需要在 Vue 实例中使用 this.$tcb ，就可以调用云开发的实例，执行其他操作。

总结

以上所述是小编给大家介绍的使用 Vue-TCB 快速在 Vue 应用中接入云开发的方法，希望对大家有所帮助！

赞 (0)

相关推荐

  • 详解mpvue开发微信小程序基础知识

    一.mpvue简介 mpvue 是一个使用 Vue.js 开发小程序的前端框架.框架基于 Vue.js 核心,mpvue 修改了 Vue.js 的 runtime 和 compiler 实现,使其可以运行在小程序环境中,从而为小程序开发引入了整套 Vue.js 开发体验.mp 即 mini program 的缩写. 二.mpvue快速入门 ① 通过脚手架引入mpvue模板 vue 3.0已经不支持vue init命令了,所以需要单独安装@vue/cli-init,安装好之后,就可以按以下操作步骤

  • vue中使用百度脑图kityminder-core二次开发的实现

    最近项目中要用到 脑图工具. 翻遍个大网站,找到 kityminder-core. 然后发现这货 年代久远,用的技术比较古董 虽然出自大厂,但是文档资料着实让人蛋疼 经过数小时的采坑,已经上岸,记录使用方法如下: 先安装模块: npm install kity kityminder-core -S 然后引用模块 import kity from 'kity' import kityminder from 'kityminder-core' 然后创建一个容器标签 <div id="minde

  • 使用 Vue-TCB 快速在 Vue 应用中接入云开发的方法

    什么是 Vue TCB 我自己平时经常会用到 Vue 来开发前端应用.所以,基于 Vue 的插件系统,封装了一个 Vue 插件. 如何使用 1. 安装 vue-tcb 执行如下命令,安装 vue-tcb # npm npm install --save vue-tcb #yarn yarn add vue-tcb 2. 在主文件中引入 vue-tcb 在你的 main.js 中加入如下代码 import * as Tcb from 'vue-tcb' Vue.use(Tcb,{ env: 'en

  • Vue使用watch监听一个对象中的属性的实现方法

    问题描述 Vue提供了一个watch方法可以让使用者去监听某些data内的数据变动,触发相应的方法,比如 queryData: { name: '', creator: '', selectedStatus: '', time: [], }, 第一种解决方案:直接对象 现在我需要监听这个queryData,我可以这样做: watch: { queryData: { handler: function() { //do something }, deep: true } } 第二种解决方案:dee

  • Python快速转换numpy数组中Nan和Inf的方法实例说明

    在使用numpy数组的过程中时常会出现nan或者inf的元素,可能会造成数值计算时的一些错误.这里提供一个numpy库函数的用法,使nan和inf能够最简单地转换成相应的数值. numpy.nan_to_num(x): 使用0代替数组x中的nan元素,使用有限的数字代替inf元素 使用范例: >>>import numpy as np >>> a = np.array([[np.nan,np.inf],\ ... [-np.nan,-np.inf]]) >>

  • Linux 命令查询小程序中的 WePY 云开发实践

    Linux 命令查询小程序中的 WePY 云开发实践

    大家好,今天我来为大家分享一下, Linux 命令查询小程序中的 WePY 云开发实践. Why WePY 首先,先分享一下为什么要选择 WePY ? 在项目开始进行选型的时候,我可选的底层框架有 WePy.MPVue.Taro.MinUI,这些框架都是工程化做得很好的框架,可以帮助小程序项目长期进行维护.其中,Taro 因为采用的是我所不熟悉的 React ,所以从一开始就被排除.MPVue 我看了以后,它更多是给 Web 开发者提供小程序转化工具,而不是给小程序开发者提供类 Vue 工具,所

  • 快速解决Vue项目在IE浏览器中显示空白的问题

    vue项目在IE浏览器中显示空白,是因为js文件没有加载,需要引入babel-polyfill这个东西,而用vue脚手架搭建的项目是没有引入此工具的 引入方法: 打开packge.json,在dependencies中加入:"babel-polyfill" : "^6.23.0" 然后重新npm install 在App.vue文件中import:import  "babel-polyfill" 这样IE浏览器就显示正常了. 以上这篇快速解决Vu

  • 快速入门Vue

    快速入门Vue

    一.什么是Vue? Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的 渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合.另一方面,Vue 完全有能力驱动采用单文件组件和 Vue 生态系统支持的库开发的复杂单页应用.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.如果你是有经验的前端开发者,想知道 Vue.js 与其它库/框架的区别

  • Vue.js快速入门教程

    Vue.js快速入门教程

    像AngularJS这种前端框架可以让我们非常方便地开发出强大的单页应用,然而有时候Angular这种大型框架对于我们的项目来说过于庞大,很多功能不一定会用到.这时候我们就需要评估一下使用它的必要性了.如果我们仅仅需要在一个简单的网页里添加屈指可数的几个功能,那么用Angular就太麻烦了,必要的安装.配置.编写路由和设计控制器等等工作显得过于繁琐. 这时候我们需要一个更加轻量级的解决方案.Vue.js就是一个不错的选择.Vue.js是一个专注于视图模型(ViewModal)的框架.视图模型是U

  • 基于vue.js快速搭建图书管理平台

    基于vue.js快速搭建图书管理平台

    Vue.js是当下很火的一个JavaScript MVVM(Model-View-ViewModel)库,它是以数据驱动和组件化的思想构建的.相比于Angular.js,Vue.js提供了更加简洁.更易于理解的API,使得我们能够快速地上手并使用Vue.js. 上一期简单讲解了vue的基本语法,这一次我们做一个小项目,搭建一个简单的图书管理平台,能够让我们更深刻的理解这门语言的妙用. 1.DEMO样式 首先我们需要搭建一个简单的demo样式,推荐大家使用bootstrap,可以很快的搭建出一个清

  • Vue.js快速入门实例教程

    什么是vue vue是法语中视图的意思,Vue.js是一个轻巧.高性能.可组件化的MVVM库,同时拥有非常容易上手的API. 一.基本结构 index.html代码: <script src="../vue.js"></script> <div id="app"> {{ message }} </div> <script src="app.js"></script> <

  • vue-cli如何快速构建vue项目

    vue-cli如何快速构建vue项目

    vue-cli 是vue.js的脚手架,用于自动生成vue.js模板工程的. 1.安装vue-cli 使用npm全局安装vue-cli(前提是已经安装了nodejs,否则连npm都用不了) $ npm install -g vue-cli 2.创建自己的工作空间 $ vue init webpack vuetest 3.项目信息 命令输入后,会进入安装阶段,需要用户输入一些信息 Project name (vuetest) 项目名称,可以自己指定,也可直接回车,按照括号中默认名字(注意这里的名字

随机推荐