前言

原生仿QQ

https://github.com/wangyang0210/Imitate-QQ-For-Mini-Program

这个是当时学习小程序时,模仿的一个demo,只不过是纯页面没啥具体的功能,现在想使用mpvue 或者 uni-app | vant-weapp 或者  colorui | gateway 来做一个真正的可以实现聊天的

步骤

构建项目

这个mpvue官网已经很详细了,所以我也没写过类似的随笔,有问题大家再说吧。

http://mpvue.com/mpvue/quickstart/

引入组件

用到什么引入什么吧

mpvue——支持less

mpvue——引入vant_weapp组件

mpvue——componets中引入vant-weapp组件

mpvue——引入iconfont字体图标

mpvue——API请求封装(小程序原生)

mpvue——页面跳转

mpvue——修改第三方组件样式

mpvue——另类支持v-html

mpvue——小程序修改input的placehold样式

mpvue——引入echarts图表

mpvue——动态渲染echarts图表

mpvue——引入echarts打包vendor过大

编写页面

先把现有的删除然后重新构建,做之前考虑哪些是可以复用的就封账成组件

mpvue——仿QQ【一】的更多相关文章

  1. SignalR快速入门 ~ 仿QQ即时聊天,消息推送,单聊,群聊,多群公聊(基础=》提升)

     SignalR快速入门 ~ 仿QQ即时聊天,消息推送,单聊,群聊,多群公聊(基础=>提升,5个Demo贯彻全篇,感兴趣的玩才是真的学) 官方demo:http://www.asp.net/si ...

  2. 仿QQ大战—界面篇

    之前在<仿QQ大战-服务器的搭建(ServerSocket)>中实现了服务器的搭建,以及一个简单地传递数据的实现,现在就是来实现类似与QQ聊天通信的功能.首先是界面的实现: 首先:服务器和 ...

  3. wpf 仿QQ图片查看器

    参考博客 WPF下的仿QQ图片查看器 wpf图片查看器,支持鼠标滚动缩放拖拽 实现效果 主要参考的WPF下的仿QQ图片查看器,原博主只给出了部分代码. 没有完成的部分 1.右下角缩略图是原图不是缩略图 ...

  4. 史上最简单,一步集成侧滑(删除)菜单,高仿QQ、IOS。

    重要的话 开头说,not for the RecyclerView or ListView, for the Any ViewGroup. 本控件不依赖任何父布局,不是针对 RecyclerView. ...

  5. JS 点击弹出图片/ 仿QQ商城点击左右滚动幻灯片/ 相册模块,点击弹出图片,并左右滚动幻灯片

    1, 点击弹出图片 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...

  6. android 自定义scrollview 仿QQ空间效果 下拉伸缩顶部图片,上拉回弹 上拉滚动顶部title 颜色渐变

    首先要知道  自定义scrollview 仿QQ效果 下拉伸缩放大顶部图片 的原理是监听ontouch事件,在MotionEvent.ACTION_MOVE事件时候,使用不同倍数的系数,重置布局位置[ ...

  7. 仿QQ列表左滑删除

    一直想写个仿QQ通讯列表左滑删除的效果,今天终于忙里偷闲,简单一个. 大概思路是这样的: 通过 ontouchstartontouchmoveontouchend 结合css3的平移. 不多说,直接上 ...

  8. Socket实现仿QQ聊天(可部署于广域网)附源码(1)-简介

    1.前言 本次实现的这个聊天工具是我去年c#程序设计课程所写的Socket仿QQ聊天,由于当时候没有自己的服务器,只能在机房局域网内进行测试,最近在腾讯云上买了一台云主机(本人学生党,腾讯云有个学生专 ...

  9. Android实现高仿QQ附近的人搜索展示

    本文主要实现了高仿QQ附近的人搜索展示,用到了自定义控件的方法 最终效果如下 1.下面展示列表我们可以使用ViewPager来实现(当然如果你不觉得麻烦,你也可以用HorizontalScrollVi ...

随机推荐

  1. 持续交付之软件包管理maven篇

    背景 持续交付的我们常见的流程如下,其中有一个环节就是软件包管理 今天我们以maven仓库为示例,如下是Jenkins与CD生态: 持续交付的示例 5 Principles 五个原则 Deliver ...

  2. 基础知识:IDE集成开发环境(pycharm)、基本数据类型、用户的交互、运算符

    今日内容: 1.IDE集成开发环境(pycharm) 2.基本数据类型(int.float.str.list.dict) 3.用户的交互(注释.输入input.输出print) 4.运算符(分类及使用 ...

  3. ideal中spring的xml文件没有提示的问题

    ideal中spring的xml文件没有提示的问题 今天第一次用ideal来练习spring,发现和视频中老师不一样,我的没有提示.老师的视频里,他写了个<mvc:a   就会有一系列的提示,然 ...

  4. 移动端video不全屏播放

    <div class="m-video"> <video x5-playsinline="" playsinline="" ...

  5. WOW.js 使用教程

    官网加动画特效,哇哦,下面我介绍一下WOW.js 官网地址:https://www.delac.io/wow/ 点击github可以找到wow.js和wow.min.js 以及animate.css者 ...

  6. Dynamics CRM项目实例之九:CRM 2015的产品中的捆绑销售

    关注本人微信和易信公众号: 微软动态CRM专家罗勇,回复140或者20150112可方便获取本文,同时可以在第一时间得到我发布的最新的博文信息,follow me!      今天的博客主要是介绍Dy ...

  7. python在sqlite动态创建表源码

    代码之余,将开发过程中经常用的代码片段备份一下,如下的代码是关于python在sqlite动态创建表的代码,应该能对各位有所用. import sqlite3 as db conn = db.conn ...

  8. 【English】七、常见动词

    一.动词: touch.hear.say.listen touch [tʌtʃ] 触摸 I touch the cat. They touch the elephant. hear  [hɪr] 听到 ...

  9. MongoDB自学(2)

    条件操作符: gt(大于),gte(大于等于),lt(小于),lte(小于等于)E.G:db.People.find({age:{$gt:100}})//查找集合里age大于100的文档 注意:str ...

  10. Redis入门教程(一)

    一.NoSQL概述 1.什么是NoSQL NoSQL,泛指非关系型的数据库.随着互联网web2.0网站的兴起,传统的关系数据库在应付web2.0网站,特别是超大规模和高并发的SNS类型的web2.0纯 ...