如何以最快速度将Vue接入在线客服系统?
虽然 Vue 框架和作者尤雨溪本人早已是研发行业,尤其是前端开发领域人尽皆知的存在,但是本文正式开始之前,还是要做一个简单的介绍,来照顾一下不太了解的读者。
Vue 框架,是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。
——摘自 Vue 官方网站
如果没有技术背景也没关系,我们来通俗地解释一下:
一般来说,项目研发分为前端和后端,如果以某个网页为例来解释,你可以简单理解为:后端研发负责“怎么让网页正常运行”,而前端研发负责“怎么让网页运行起来更好看”。
但这个时候,问题出现了:想让网页好看有无数种方案,前端研发人员不论用哪种方案,都得从零开始一点一点地搭建,费时费力。
于是类似 Vue 这样的前端框架就诞生了,它直接告诉所有前端研发人员:不用花时间想这个问题了,我给你搭好了一个框架,你只需要把你觉得好看的元素放进去就行了(即:模块化)。
这样一来,不仅提升了研发的效率,还降低了成本,一举两得,非常完美~
好了,解释完 Vue 的用途,我们就该回到今天的正题了:如何将 Vue 接入在线客服?
首先,在线客服的 JS 插件代码一般放在 index 入口页,可以参考下图:
接入成功后,呈现的效果,如下图右下角红框所示(这里用美洽官网来举例):
是不是灰常简单?
但是先别着急,因为真实环境下的需求是复杂的。
比如:如果想在某些页面隐藏咨询入口(或按钮),或者在特定的页面用特定的方式展示咨询按钮,该如何才能实现?
可以通过调用_MEIQIA('withoutBtn');方法(下图)实现隐藏入口(或按钮)吗?
事实上,这种方式实时调用是没有效果的,一旦隐藏就会将所有页面的咨询入口(或按钮)全部隐藏。
我们建议:比较好的做法是自定义按钮,在需要咨询按钮的页面调用美洽_MEIQIA('showPanel');方法打开聊天窗口。
有些技术人员按照这样的方式做了,比如:在 Vue 模板里直接调用 _MEIQIA('showPanel');
但是却发现:
这样的方法是无法实现的。原因是 Vue 并不支持这样直接调用,会报错。
正确的方法应该是调用 window._MEIQIA('showPanel'); 如下图所示:
这样就会在指定页面中,点击自定义按钮的情况下,弹出对话窗口,而其他页面不显示咨询入口或按钮,如下图所示:
如何以最快速度将Vue接入在线客服系统?相关推荐
- APP客服系统搭建,手机APP如何接入在线客服系统?
随着互联网技术的不断发展和完善,很多企业都开发了自己的APP,以此来介绍自己的产品和服务.为了更高效地与APP客户建立连接,很多企业选择了对接米多客智能客服系统,一方面APP用户有疑问,可以直接在AP ...
- 如何在自己APP中接入在线客服系统,App接入第三方在线客服系统方法
很多App都有能直接在App内找到客服咨询入口,方便及时解决客户问题. 如果你的app也想要配置客服系统,怎么才能实现? App内需要添加好一个客户咨询按钮,然后在客服咨询按钮点击后跳转到H5客服聊天 ...
- 全渠道客服系统 php开发,在线客服系统全渠道接入有什么作用?
在线客服系统渠道接入的发展历程 在线客服系统渠道接入的方式是跟互联网.移动互联网的发展紧密相关的. 过去,在移动互联网未能普及的时候,人们多是使用电脑,通过电脑网页.邮件.客服电话这样的传统的方式来跟 ...
- 怎么联系vue客服_Vue在线客服系统【开源项目】
1. 项目介绍 一个基于Vue2.0的在线客服系统. 技术栈包含:Vue.VueX.Vue Router.Element UI. 2. 功能介绍 项目包含了2个模块:客服端和访客端. 2.1 客服端功 ...
- 微信公众号接入多客服系统,功能使用说明
微信公众号在用户获取和服务方面发挥着重大作用,那么有没有好用的公众号运营工具来辅助粉丝运营呢,不仅仅解决沟通而已,还承担着私域流量,后续转化等. 公众号怎么接入客服系统?哪些亮点功能提示运营/服务效率 ...
- 自建商城或会员系统如何对接在线客服咨询系统,例如商城系统、物流订单系统接入在线客服功能...
自建商城或会员系统如何对接在线客服咨询系统,例如商城系统.物流订单系统接入在线客服功能 对接在线客服咨询系统可以帮助您的客户更快地获得问题解答和支持,提升客户满意度和忠诚度. 在商品详情页面传递产品信 ...
- 在线客服系统源码软件代码+自动回复+可生成接入+手机版管理后台
介绍: PHP在线客服系统源码是一款PHP开发的在线客服系统源码,网站在线客服系统,网页在线客服软件代码,免费在线客服系统源码,支持多商家多客服,客服系统源码支持二开,客服同时支持手机移动端和PC网页 ...
- 微信小程序怎么接入多客服系统
最近有很多运营人说,微信公众号越来越难做了,打开率和分享率呈下滑趋势,发文就掉粉,随着小程序的功能不断优化,很多运营人纷纷投入小程序的怀抱.小程序将在今年彻底爆发,更多创业者.流量主会进场厮杀.所以只 ...
- 如何实现在线客服系统(java+netty+hazelcast+electron+vue)
开源在线客服系统-适合中小企业 简介(项目100%开源) 预览 Github 地址 交流沟通方式 简介(项目100%开源) 为满足用户在线文本咨询类问题,而搭建的人工在线客服系统.此系统支持集群化部署 ...
- 【微信公众号】微信集成功能--接入多客服系统
目录 需求来源 实现思路 1.邀请指定人员成为客服角色: 2.用户在公众号发送信息,通过关键字触发事件:通知客服: 3.客服角色接入会话,与用户对话沟通交流解决疑问,完成对话: 代码实现(基于Lara ...
最新文章
- 机器视觉中如何选择工业相机与合适的相机镜头
- 【C++】函数指针的嵌套
- 拖慢操作系统启动的8个真实原因
- 2016年Android实习岗位 腾讯二面+阿里一面
- python 进度条_六种酷炫Python运行进度条
- 运行多个 npm script 的各种姿势
- 【mysql问题】can't connect to mysql server on 'localhost' (10060)
- lunix mysql创建视图_Linux命令:MySQL系列之六--VIEW视图/mysql -e
- python小欢喜(八)俄罗斯方块 (12) 添加游戏音效
- 烧钱圈地后,医疗大数据如何变现?
- MicroExpSTCNN and MicroExpFuseNet-基于三维时空卷积神经网络的自发面部微表情识别
- CSS里的BFC和IFC的用法
- 蚂蚁分类信息系统伪静态多城市版nginx规则自适应URL
- 高斯帕滑翔机枪matlab,高斯帕滑翔机枪的播种机这么做?
- mdf数据库文件怎么打开?
- 教你如何做个妖精(女人必读)
- Qt 实现录音在线转文字
- Objective-C 【对象-多文件开发简介】
- Axi:名词解释、乱序、间插、卷绕、窄带访问、非对齐访问、OST
- python和接码平台对接_GitHub - zhupite233/yima: 易码平台API的Python接口
热门文章
- 函数在线绘图工具fooplot desmos
- c++学习:多态案例之魔法门英雄无敌
- 前端html制作中国地图,echarts实现中国地图
- pandas中category类型的数据处理
- 7-24 猜数字游戏 (15分)
- Linux系统u盘win7没驱动程序,u盘安装win7找不到设备驱动程序,教您解决u盘安装win7找不到设备驱动程序...
- 自行车电动自行车|GCC认证办理流程
- python可以下载百度文库_python+selenium爬取百度文库不能下载的word文档
- java学习感想_Java学习感想
- JS数据结构中的集合结构详解